WordPress Theme Customizer Not Working Error: How to Fix?

The theme customizer is where you can actually edit all aspects of your website. In some cases, however, the WordPress theme customizer may stop working and display a blank screen.

While it’s natural to be concerned, rest assured that this is one of the most common WordPress errors that can be resolved. The steps below will assist you in effectively and quickly troubleshooting the WordPress theme customizer not loading error.

Let’s get started.

What is the cause of the theme customizer not working error?

The error occurs when you are trying to access the WordPress theme customizer via the Appearance tab. When the customizer stops working, and you are presented with a blank screen like the one below.

This error could be caused by a variety of factors. Let us go over the various solutions to the problem.

Delete the browser’s and the site’s cache.

The first and most straightforward solution is to clear your browser cache. It’s possible that some scripts in your browser cache are preventing the WordPress customizer from loading. Clearing the cache will aid in the proper rendering of the customizer.

You should also clear the cache on your website. Clearing the site cache will be useful if you’ve enabled caching for logged-in users.

Return to the default theme.

There could be an issue with your current theme that is preventing the theme customizer from loading. To eliminate this possibility, try using the default WordPress theme.

You can switch themes in your WordPress dashboard by going to Appearance > Themes.

Did changing over help solve the problem? If not, proceed to the next solution.

Turn off all plugins.

Due to some script running in the background, one of the plugins installed on your website may also be interfering with the proper loading of the customizer. To investigate plugin-related issues, you should disable all plugins on your site.

Then attempt to open the theme customizer. If the customizer now loads properly, it means that one of the plugins was the source of the problem. Now, one by one, activate the plugins, checking whether the customizer is working or not.

This way, you’ll be able to identify the rogue plugin quickly.

Upgrade the PHP version

Because WordPress is powered by PHP, an outdated PHP script running on your server could be the cause of the customizer not loading issue.

Navigate to Tools > Site Health > Info > Server to see what PHP version is running on your site.

If your PHP version is less than 7.0, you must upgrade it immediately. Your hosting panel should allow you to update the PHP version. If you can’t, you should request that your web host upgrade the PHP, preferably to the most recent version.

Update WordPress as well as the current theme.

I also recommend that you use the most recent version of WordPress. If not, you should update it right away because version 5.9 recently introduced full site editing and replaced the customizer with the Site Editor for WordPress block themes.

In addition to updating the core, you should also update your current theme to the most recent version and ensure that the theme is regularly updated by the theme author, as legacy themes use outdated code that may interfere with the theme customizer’s smooth rendering.

Substitute the wp_ob_end_flush_all function.

If none of the above solutions worked to resolve the theme customizer loading issue, copy and paste the following code into your current theme’s functions.php file.

remove_action( 'shutdown', 'wp_ob_end_flush_all', 1 );
add_action( 'shutdown', function() {
   while ( @ob_end_flush() );
} );

Technical Solutions

Certainly, here are some more technical steps with code examples.

1. Increasing PHP Memory Limit: Open your wp-config.php file. You can find this file in the root folder of your WordPress installation. Add the following line of code at the very bottom, right before the line that says, “That’s all, stop editing! Happy publishing.” define('WP_MEMORY_LIMIT', '256M'); Save your changes and exit. If this doesn’t work, it might be that your hosting provider doesn’t allow this limit to be increased. In that case, you would need to contact them.
2. Debugging JavaScript Issues: To find JavaScript issues, you can use your browser’s built-in developer tools. For Chrome:

• Right-click on your page and choose “Inspect” or use Ctrl+Shift+I.
• Click on the “Console” tab.
• If there are any JavaScript errors, they’ll be displayed in red. You can use these errors to help identify the problem.

1. Checking Your .htaccess File: The .htaccess file is located in your WordPress website’s root directory. You can access it via FTP or your web host’s file manager. To rename it:

• Connect to your website via FTP or your hosting account’s file manager.
• Locate the .htaccess file in your website’s root directory.
• Rename it to something like “.htaccess_old”.
• Check if the problem is resolved. If this solves your issue, you’ll need to go to your WordPress admin area and navigate to “Settings > Permalinks”. Click the “Save Changes” button without making any changes. This action will generate a new .htaccess file for your site.

1. Update WordPress Manually: If you cannot update WordPress from the dashboard, you can do it manually.

• First, download the latest version of WordPress from WordPress.org.
• Extract the zip file, and you will see a wordpress folder. Inside it, you will find all the core WordPress files.
• Connect to your website using an FTP client and go to the root directory of your WordPress site.
• Upload the new wp-includes and wp-admin directories and replace the ones on your site.
• Go back to the root directory and upload all files from the WordPress folder on your local machine. This will replace all the old WordPress core files with the new ones.
• If prompted to overwrite files, choose yes.

1. Child Theme for Customizer Changes: Creating a child theme is good practice if you’re making customizations to a theme. This way, your changes won’t be lost if the parent theme gets updated. Here’s how you can create a basic child theme with a functions.php file that enqueues parent and child theme stylesheets. Create a new directory in your theme directory, and create a style.css and functions.php files. In your style.css, put the following:
2. /* Theme Name: Twenty Twenty Child Template: twentytwenty */ In your functions.php: <?php add_action( 'wp_enqueue_scripts', 'enqueue_parent_styles' ); function enqueue_parent_styles() { wp_enqueue_style( 'parent-style', get_template_directory_uri().'/style.css' ); } ?>
3. Remember to replace twentytwenty it with your parent theme name.

If these steps do not help, there might be an issue with the server, PHP version, or database, for which you might have to contact your hosting provider.

Summary

There could be several reasons why your WordPress Theme Customizer is not working. Here are some troubleshooting steps that may help you resolve this issue:

1. Clear Your Browser Cache: An old or corrupted cache can sometimes cause issues with the WordPress Customizer. The first step is to try clearing your browser cache.
2. Check for Plugin Conflicts: A faulty or outdated plugin can also cause problems. Deactivate all plugins and then try using the Customizer again. If it works, you can reactivate your plugins one by one until you find the one causing the issue. Once you find it, try to update the plugin or contact the developer for support.
3. Switch to a Default Theme: Your current theme may be causing the problem. To test this, switch to a default theme like “Twenty Twenty” and try using the Customizer. If it works with the default theme, the issue is likely with your current theme. In this case, try updating the theme or contacting the theme’s developer for support.
4. Increase PHP Memory Limit: Sometimes, PHP can run out of memory, causing various functions in WordPress to stop working. To increase the PHP memory limit, you can modify your wp-config.php file and add this line: define('WP_MEMORY_LIMIT', '256M');.
5. Update WordPress: If you’re running an older version of WordPress, updating it could potentially fix the issue. Always make sure you have a backup of your site before updating WordPress.
6. Check for JavaScript Issues: JavaScript issues can stop the WordPress Customizer from working correctly. You can use the browser’s developer tool to check for JavaScript issues. For example, in Chrome, you can right-click on your website, select “Inspect,” then click on the “Console” tab to view any JavaScript errors.
7. Check Your .htaccess File: Sometimes, rules in your .htaccess file can cause issues. You can try renaming your .htaccess file to something like “.htaccess_old” and see if that resolves the issue. If it does, you’ll need to save your permalinks again from the WordPress dashboard to create a new .htaccess file.

Remember, before making any changes, it’s always a good idea to back up your website to prevent any data loss.