Theme customizer not working in WordPress – common solutions

How to solve issues with the Theme Customizer / Live Preview

The WordPress Theme Customizer is a great and awesome feature to customize your WordPress website very easily with only a few clicks in the options panel. You can change many aspects of your site or WordPress theme and even see a live preview before you save your changes to the database. But in rare cases it may happen that the theme customizer suddenly stops working.

Why does the Theme Customizer stop working

When you notice that the WordPress theme customizer suddenly stops working and if the live preview in your WordPress dashboard was working fine before, then the most common reason for the issue is a plugin conflict. Even if you have changed nothing on your site or have not installed any new plugins, your issue still can be caused by a previously installed plugin, for example when a plugin was updated automatically or in case there are plugin leftovers on your website.

Troubleshooting WordPress Theme Customizer
Image Source: RyanMcGuire – Pixabay.com / License: CC0 Public Domain

The most common issue when the theme customizer is not working anymore, is that people see a blank screen instead of the live preview in their WordPress dashboard. This blank screen can be related to conflicting code on your WordPress website (e.g. conflicting plugins) or even related to a fatal error which usually results in the common White Screen of Death.

Sometimes also the buttons of the menu items in the theme customizer do not work anymore and in very rare cases even the menu items won’t show up. These kind of issues often are related to issues with JavaScript, for example when the JS is blocked by a plugin or other scripts on your site.

What to do when the Live Preview is not working

In most cases you can solve issues with the theme customizer by disabling your plugins in the WordPress dashboard. You could try deactivating your plugins one by one to identify the plugin that is causing the issue and then just replace the specific plugin with a plugin that doesn’t cause issues.

Deactivate WordPress Plugins
Image Source: Clker-Free-Vector-Images – Pixabay.com / License: CC0 Public Domain

By the way, when a WordPress plugin is causing these kind of issues, it does not necessarily mean that the plugin is bad or not well coded, sometimes the reason simply is that the plugin isn’t compatible with other plugins that you may be using on your website or not compatible with your WordPress theme, which also doesn’t necessarily mean that you’re running a low-quality theme.

There are thousands of WordPress themes and plugins available on the market. When running several plugins on your website, you’re in the end mixing a lot of 3rd party code together and there always is a risk of conflicts. Compatibility issues can’t be 100% avoided in the real world and there never is a guarantee when you install multiple 3rd party plugins on your WordPress website.

Update your WordPress environment

Also a very common issue is when you are running an outdated version of WordPress and the customizer in WordPress shows a blank page. Many WordPress themes nowadays have added custom panels and additional options to the customizer, for example to add theme options.

Theme Options Panel

For example, panels have been introduced in WordPress 4.0 and if you are running an outdated version of WordPress, the customizer may turn blank if you are using a theme that has added panels. You can easily fix this by updating WordPress to the latest version. Here you can find more information about the panel issue: How to fix the add_panel() error when customizer does not work.

In general it’s always very important to keep your WordPress environment up-to-date, this doesn’t only apply to WordPress itself, but also to all WordPress themes and plugins you may have installed on your website. Whenever you’re running outdated code on your site, there is a potential risk that this may result in issues with the WordPress customizer or even lead to security vulnerabilities.

What if the Theme Customizer is loading without styling

In very rare cases it is possible that the live preview of the theme customizer loads without CSS styling and that you only see blank and ugly HTML output in the customizer, instead of your shiny website. Whenever this happens, it’s hard to say what could cause your issue because this would require further analysis and some troubleshooting on your site.

Debugging WordPress
Image Source: Mocho – Pixabay.com / License: CC0 Public Domain

In case troubleshooting and disabling your plugins doesn’t help and if you are desperate because you also can’t find other reasons for your issue, then you could try to add the code snippet below to the file wp-config.php of your WordPress installation and it may resolve your issue:

define('CONCATENATE_SCRIPTS', false);

However, if the customizer in WordPress doesn’t load CSS stylesheets or else, this also may be related to issues within your hosting environment (e.g. insufficient file permissions on your server). If you can’t find the cuplrit of your issue by doing troubleshooting, disabling plugins or adding the mentioned snippet, it may also help to contact your hosting company for further analysis.

You’ve tried everything and the Theme Customizer is still not working!

In case you can’t locate the issue on your site, have checked all installed plugins, have reinstalled WordPress and/or your WordPress theme, have contacted your hosting company and if you have no other ideas anymore what could cause your issue with the theme customizer in WordPress, you could try to add the following code snippet to the file functions.php of your child theme (or by using a plugin to add code) and see if that helps to solve your issue:

remove_action('shutdown', 'wp_ob_end_flush_all', 1);

Conclusion: Solving issues with the WordPress Theme Customizer

We hope that this article was helpful in order to solve your issues with the customizer in WordPress. If you have any other solutions to common issues with the customizer that are missing in this article or if you’re facing other rare issues with the theme customizer, please let us know in the comments below. We’ll then update this article from time to time to help as much WordPress users as possible.

This article also helped WordPress users with the following issues:

  • Theme Customizer Preview Screen is blank
  • Theme Customizer loads without CSS styling
  • Theme Customizer not loading JS for live preview
  • Customize/Live Preview not working
  • Can’t customize theme in WordPress
  • Theme Customizer does not load anymore

Share this with your friends

70 Comments

  1. Do you know you are a savior – You just saved me from an issue I am struggling since 60 days. No hosting provider, no developer & no blog provided solutions that worked. I was just going to replace the whole site with new hosting. This solved my customizer loading & preview issue:

    define('CONCATENATE_SCRIPTS', false);

    Love you for this.. 🙂 from my team.

      • Dear MH Themes, as Cathie just mentioned, “thank you, thank you, thank you!!!” That little code snippet just fixed my problem! And Cathie, thank you for your comment…it helped me find the solution within 10 minutes of searching! Fastest resolution I’ve had in years!

  2. Thank you very much for your article, it’s very good. In my old configuration server with PHP 5.2.* more plugins are blocking the Theme Customizer. For example: Contact Form Maker, All In One WP Security, CMS Tree Page View, Dynamic Widgets.

  3. Hey, Customizer color settings only seem to work for the homepage only. What could be the problem? The website is still under development and I’m hosting it on my XAMPP local server.

    • Hi Sammy, this could be related to misconfigurations in XAMPP / WordPress or it’s also possible that some of the plugins which you’re running have conflicts with the WordPress Customizer. You could also check if the WordPress theme you’re using has visible elements that will be changed through the color options in the Customizer or if this only affects other elements that might not be visible on any page on your particular WordPress website.

  4. This worked for me and you are GREAT.

    remove_action('shutdown', 'wp_ob_end_flush_all', 1);

    Read a lot about this issue without any proper solution and you fixed it easily.

  5. Hi, after trying these suggestions, I still cannot get to customize my site (I used to be able to but now cannot since about two weeks). I have reinstalled WordPress and deactivated all plugins but the problem persists (also, the widget screen is incomplete / blank on the right side).

    I also have reinstalled the MH Magazine theme but when I try to customize, the page is mainly white and blank with “Edit Add MH Author Bio at the top right” (completely broken CSS and incomplete page loading). I am not asking that you fix this but rather provide additional advice. Thanks a million. Love the theme by the way.

    • I offer an apology for posting my support question here. Within minutes, the support team reached out to me with the solution, which was to update the theme. Thanks a million. I hadn’t done that as WordPress never indicated that a new theme was available. Thanks again for the usual great, responsive help at MH Themes.

  6. You are a HERO. Superman, Batman. WPMAN. Any Superhero you want to be. I have 3 WP sites. All with the same problem. This works:

    define('CONCATENATE_SCRIPTS', false);
  7. Damn this error was a pain in my ass. Tried everything possible. And after reading this post. I deactivated each plugin one by one. It was the Easy Google Fonts plugin that caused all the problems. Now the live preview works fine. And to mention, before experimenting anything don’t forget to take a backup of your site. Thank you so much for the great article. Cheers!!!

    • Hi Shreyas, thanks for the kind feedback. Disabling plugins one by one indeed is the first thing you should do if the theme customizer / live preview stops working, because in 99.9% of cases plugin conflicts prevent the customizer from working as expected. More information about solving common WordPress issues also can be found here: Troubleshooting in WordPress.

  8. Hi, my WordPress theme is not working with any of the suggestions above. No matter what I do some changes just do not want to save. I have also tried everything. Please can someone help?

    • Hi Roxy, if you are really sure that you’ve deactivated your plugins and also that everything in your WordPress environment (WordPress core, plugins, themes, scripts, etc…) is up-to-date and in case the WordPress customizer still isn’t working for you, then you could contact your hosting company and/or the theme developers of your WordPress theme for further analysis.

  9. I have tried every single suggestion by you in this article but still I’m unable to get back my customizer in WordPress. Please help! 🙁

    • Hi Abhisek, as mentioned in the previous reply, the customizer is default WordPress functionality and usually should work out of the box, unless there are conflicts on your website. If you are really sure that you’ve deactivated your plugins and also that everything in your WordPress environment is up-to-date, then you could contact your hosting company and/or the theme developers of your WordPress theme for further analysis.

  10. Hi, I’m using a WordPress theme with a customized customizer and all the changes I make seem to only apply when I’m inside customize mode. They don’t apply to the page itself. Any solutions? Thanks!

  11. Hello, I bought a WordPress theme from another developer. WP is updated to 4.7. I installed the WordPress theme and the required plugins, activated the license but my template customizer does not work and keeps loading. I also tried your advices and nothing works. 🙁 I also tried the lite version of the template and it works without problems. I have just the problem with this template. Can you please give me any advice what to do?

    • Hey George, the theme customizer is WordPress core functionality and usually works out of the box, unless you’re running plugins or other code that is conflicting with the customizer. If you’ve already tried all the suggestions here, then there is not much other advice we can give you.

      Have you tried to contact the developer where you’ve purchased your WordPress theme from? Especially when you’ve purchased a theme, the developers should try to help you with your issue, especially when there is an issue with their theme and WordPress core functionality.

  12. I have deactivated all plugins and the customizer is still blank. I also checked with my mobile device and the customizer is working fine but with my desktop it is malfunctioning. Please help what should I do?

    • Hi, if the customizer in your WordPress dashboard is working fine on your mobile device, but not on your desktop computer, then it’s very likely an issue related to the browser you’re using on desktop. You could check if you’ve enabled JavaScript in the browser settings and also ensure that you’ve cleared the browser cache on your desktop computer.

  13. Wouldn’t a much simpler fix be for WordPress to stop using this function altogether? What’s wrong with using the stylesheet? As it is now, WordPress themes are forced to use both the Customize function AND the stylesheet and many of the functions found in Customize aren’t even found in the stylesheet. Why have both?

    • Hi Sam, thanks for your feedback regarding the customizer in WordPress. However, it seems you’ve misunderstood the purpose of the customizer. It’s also very important to understand the difference between functionality on your website and the design of your site depending on the CSS code in your stylesheet (style.css file). These are two completely different things.

      A stylesheet contains CSS code and that code basically is for styling purposes (colors, layout, typography, etc.). The purpose of the customizer in WordPress on the other hand is to configure your website while seeing a live preview of your changes. This doesn’t necessarily involve CSS changes. It’s also about configuring custom menus, uploading logo, header or background images, enabling and disabling site elements on your website and so much more.

      That means many things you can change through the WordPress customizer are not something you would be able to achieve by modifying CSS code in your stylesheet because it doesn’t always only involve styling, but functionality as well. It’s also important to keep in mind that most people are not familiar with coding and these users usually don’t want to change code in a stylesheet, but instead use some simple options in the customizer to achieve what they want. So the purpose of the customizer basically is to improve usability for non-tech-savvy users.

  14. In my case the customizer did work and I could see the changes in the preview, but not on the real site. It didn’t save the changes. In my case I had to turn auto_increment on, in the database wp_posts table. After that it worked. For some reason updating my website to WP 4.7 turned auto_increment off.

    • Thanks for sharing. If you don’t see changes on your website after using the customizer, it also could be related to caching and in that case you could clear your browser cache, clear the cache of your caching plugin (if available) and then refresh the site in your browser.

  15. Hi, the widgets option in my customizer displays that “There are no widget areas on the page shown, however other pages in this theme do have them.” I get this message on all themes. I get this message on all desktop browsers. However, using Chrome on a mobile displays the available widgets. There is no guide online to solve this issue.

    It’s very difficult for me to build my site in the absence of this functionality. This occurred after the power on the laptop died suddenly without the changes in the customizer being saved. I’ve tried adding your codes, reinstalling WordPress, contacting my hosting providers, changing themes, changing browsers. But none of them seem to work.

    • Hi George, the “There are no widget areas on the page shown, however other pages in this theme do have them.” notice in the customizer usually means that the widget areas can’t be rendered in the customizer. The customizer possibly also keeps spinning / loading in that case. This could be related to JavaScript issues on your website. You could try to inspect the customizer with the console in your browser developer tool and try to get some more information on your issue.

      Disabling 3rd party plugins is something you’ve probably already tried, especially when you say that you’ve already reinstalled WordPress. However, you could also try to reinstall WordPress with a fresh database and see what happens. By the way, apart from within the customizer, you can also manage widgets in your WordPress dashboard under Appearance => Widgets.

      • Hi, I did a fresh install of WordPress in a new database. I completely wiped the old WordPress. The issue is still present. Also, the strange thing is that this is happening only on my PC. It’s working fine on a friend’s PC. It’s also working fine on my smartphone.

        • Ok, in that case your issue with the customizer doesn’t seem to be related to WordPress, but rather to your PC. That means you could focus on your PC instead, clear the browser cache, possibly delete and re-install the browser and do further troubleshooting.

  16. Hi, I have installed a new WordPress theme and have now set up my website but every time I click to view the site, it goes back to the original template. I do not know what to do, I am not tech minded. I have noticed that the theme is showing a blue button with “customizer”. Do I click it? Or will this wipe out my site? I hope one of you knows how to help me. Thank you.

    • Hi Andy, especially if you are not familiar with WordPress yet, it would be recommended to have a detailed look at the documentation for your WordPress theme and contact the theme developer for further assistance if necessary. If you have a button that says “customizer”, then clicking on it usually won’t wipe out your website, but take you to the WordPress customizer instead where you can configure your site accordingly.

      After configuring your website in the customizer, you should save your changes correctly. When you view your website after saving the changes in the customizer, you should see the modified site as expected. If that isn’t the case on your site, then it’s very likely that you’ve missed a step or there is a caching issue on your website and in that case you should clear your browser cache and / or the cache of your caching plugin (if available).

  17. I had a problem with the customizer in WordPress as well. I deactivated all the installed plugins and the customizer started showing properly. On reactivating the plugins I noticed the problem was from the Jetpack plugin. I disabled the Extra Sidebar Widgets, Widget Visibility options and now everything is working very well. I hope it helps.

  18. Hi, Unfortunately all the above did not work for me. I do not have the issue with the parent theme of my ecommerce theme. Only if the parent theme (that was working just fine till recent updates) is active. I tested by removing all custom codes, and it still persists. Any ideas?

    • Hi Annie, if your issues with the customizer occur only if you’ve activated a particular WordPress theme while you have disabled all plugins and haven’t modified any code, then it would be recommended to contact the theme developer for further analysis.

  19. Hey, suddenly something went wrong and the Theme Customizer shows a different picture – disrupted picture of the site, different than how the site looks actually. The problem occurred when I was working on the customizer and the backup plugin began to work and everything went wrong. Because of this, now I cannot use the customizer because if I press Save, the site itself goes awry in accordance with the live preview. What can I do? Please help, thanks.

    • Hi Yoav, whenever you are facing weird and unexpected issues on your website, the first thing you should do is some troubleshooting (e.g. disabling all plugins, clear cache, etc.) and then check again. Usually this will already resolve issues with the WordPress customizer.

      Also, when you say that the issue started during a backup that was taken care by your backup plugin, it’s very likely that something went wrong during the backup. In that case you could try to restore a previous backup and see if that helps to solve your issue with the customizer.

  20. Thank you so much. My team is very happy with the solution you provided with this code. My customizer in WordPress wasn’t loading well, but after I put this code on the last line in the file wp-config.php, I had instant results:

    define('CONCATENATE_SCRIPTS', false);

    Thanks for the code snippet.

  21. Thank you so much! I was struggling and stressing out for days thinking I was going to be stuck with my theme exactly as it is forever! Turns out it was the Jetpack plugin. Life saver!

  22. The issue with missing styling also happens simply because of using a child theme, but not importing the parent theme styles. There are several ways to do this (@import etc.), but below is a good one for making sure the parent styles are added and that your custom styles are used and not cached during development. (when done developing, just remove the ” . rand()” part)

    You can solve it by adding the following to your child theme’s functions.php:

    // Making sure your child theme has an independent version and can bust caches: http://wordpress.stackexchange.com/a/182023/30783
    
    // Filter get_stylesheet_uri() to return the parent theme's stylesheet
    add_filter('stylesheet_uri', 'use_parent_theme_stylesheet');
    
    // Enqueue this theme's scripts and styles (after parent theme)
    add_action('wp_enqueue_scripts', 'my_theme_styles', 20);
    
    function use_parent_theme_stylesheet() {
        // Use the parent theme's stylesheet
        return get_template_directory_uri() . '/style.css';
    }
    
    function my_theme_styles() {
        $themeVersion = wp_get_theme()->get('Version') . rand();
        // Enqueue our style.css with our own version
        wp_enqueue_style('child-theme-style', get_stylesheet_directory_uri() . '/style.css', array(), $themeVersion);
    }
    • Hi Jonathan, indeed, when people do not create child themes correctly, it can lead to issues with the WordPress customizer as well. But that’s always the case when working with code, because an unexperienced coder can mess up basically anything when modifying code incorrectly. That’s why it’s important to only touch code if you really know what you are doing. We also have an article that covers child themes: Creating child themes in WordPress.

  23. Hi guys, in my case the problem was the Yoast SEO plugin (the latest version – 4.2.1 and the latest WP version – 4.7.2). Any ideas?

    • Hi, the Yoast SEO plugin is one of the most popular SEO plugins for WordPress and as far as we know, the plugin doesn’t break the WordPress customizer. It’s very likely that your issue with the customizer is being caused by something else on your site and you could do further troubleshooting to find the culprit: Troubleshooting in WordPress.

      • I’ve been through a lot of testing thanks to your excellent article and at first, it looked like the culprit was Yoast SEO 4.3 running on WP 4.7.2. I had removed the Yoast plugin from my site and the Customizer started working fine again.

        But further testing showed that it was only when another plugin was active (I had just updated it before the issue started), that the Customizer was blank. Removing the other plugin and leaving in Yoast SEO 4.3 allowed the Customizer to work.

        I’ve tried both the “concatenate scripts” and the “flush” solutions, but neither has allowed me to re-activate the other plugin on my site while having Yoast SEO installed as well. I’m off to the plugin developers to see if they have an answer. Thanks again!

  24. Here’s another possible solution (none of the proposed solutions worked for me): I modified the name of my child theme folder to omit hyphens. So “mytheme-child” became “mytheme_child”. Instant success! Hope that helps someone.

  25. Hello, I’m very close to throwing myself out of the window. I want to add some customised CSS code to the customisation area, menu option – Appearance – Customize. When I’m taken to the menu and live preview, the live preview display expands and basically, the only way I can describe it, is that it overwrites the customisation menu. Just leaving a full screen live preview.

    I have done all the usual stuff, disabled plugins, sworn at the screen etc etc …. to no avail. The website itself is fine and the issue only occurs in the WordPress Customizer. I’m not using a WordPress theme by MH Themes, but I’m hoping you may know the answer.

    • Hi Mike, if you really have completely disabled / deleted all plugins and haven’t modified any code that could cause your issue, then you may want to reach out to the developers of your WordPress theme. Maybe they can provide additional insights as this possibly is a known issue.

  26. When I try the Customize button I get a HTTP 500 error or sometimes just a blank page. I’m using Twenty Seventeen and installed it 3 times… I tried different themes and they work… It is only the Twenty Seventeen theme that is giving me this problem.

    I deleted the theme that was part of the webhost install and downloaded a new version from WordPress… same problem. I have no plugins… it is a brand new install.

    • Hi Paul, Twenty Seventeen is a default WordPress theme which is running on millions of websites. It’s very unlikely that the theme is the issue. The theme needs at least WordPress 4.7 to function properly, so if you’re running an older version of WordPress, then please update.

      If that isn’t the issue on your site, then it’s very likely a hosting related issue and you could contact your hosting company for further analysis. If even the default themes aren’t running smoothly at your host, then it’s probably not a good idea to host your WordPress site there. You could have a look at our overview of recommended WordPress hosting companies.

  27. Hi, I can’t open the theme customizer in WordPress anymore. I don’t know why. If I click on Customize, I get this: HTTP ERROR 500.

  28. Hi, I’ve just updated my WordPress to the latest version and now I can’t make any changes in the customizer anymore. I just get the following error message:

    Non-existent changeset UUID.

    I don’t know why this is happening. Does anybody know a fix for this issue? I’ve already tried all suggestions in your post but unfortunately it didn’t help.

  29. Not sure if this helps anyone, but I went through individual plugins that I had installed, the WordPress’s Jetpack plugin was giving me the blank preview page for my business theme.

    Moreover, it was preventing my contact form from landing on the proper page once a contact form was filled out. The contact information was sent to the prescribed email, but with the Jetpack plugin activated, the user who filled out the form then landed on a Server Error 500 page. Not good for business. Unprofessional. Hope it helps.

    • Hi Snot, thanks for sharing these insights as this may help other WordPress users who have issues with the live preview in WordPress. You may want to reach out to the developers of your WordPress theme. It’s possible that there is a known conflict with your WordPress theme and the Jetpack plugin. Maybe there is a fix available to solve your issue.

  30. If you are having problems with the customizer saving your changes. Once you’ve made your changes in the customizer hit CTRL/F5 at the same time. It should refresh your page with changes saved!!!

  31. I cannot customize my WordPress website’s header etc. I have already updated my WordPress to 4.8 version. Every time I press the Customize button it keeps sending me back to my preview website. Please help me. Anyone?

    • Hi Larry, you’re using the Twenty Ten WordPress theme on your site. That is a default WordPress theme and the customizer should work just fine. If it doesn’t, then you could do some general troubleshooting in order to solve your issue (disable plugins, etc…).

      Please also keep in mind that customizing the header of your website usually happens in the WordPress customizer. That means usually it’s normal that you see a preview of your website. The website preview is part of the customizer in WordPress.

  32. Hi, I had this issue on a Multisite. Determined that it was WooCommerce causing 500 errors on the customizer. The fix for me was changing from PHP 5 to 7… go figure.

Leave a Comment

Your email address will not be published.


*