How to fix white text and missing buttons in WordPress visual editor

Few days back I also faced this problem where I found that in visual editor text color was set to white and editing buttons were missing but website was up and working fine for end users. As soon as i found this problem i started searching the web and came to know that i was not alone there are lots of users who are victim of this problem.

WordPress theme customizer is not working

But later on I found that it’s not only the visual editor, my theme customizer also had corrupted. This article will also help those whose theme customizer is not working.

I found some solutions which were common on all sites or I can say these were the only solutions which were available on every website. Being a nice and helpless guy I followed each step and applied every method but still, it did not work for me. I went through the comment section and found that for some it worked and for other special users like me it did not work.

I was finally left with no other option than to create a new database and reinstall everything again. So being a clever guy I decided to experiment with my website and see if I could fix it or not. Even if I make it completely worse or even dead, so what I had only one option before and still last option is there. So why not play around with this.

So I would first discuss the most common solutions which may work for you.

How to fix white text and missing buttons in WordPress visual editor –

• Clearing browser cache/logging in with a different browser/ login in incognito (private) mode.
• Deactivating all plugins
• Installing the TinyMCE advanced plugin
• Replacing the TinyMCE folder with a fresh copy.
• Configuring wp-config.php file.

If you have already tested the above methods and still it did not fix the problem then you can skip to the last method (6) which worked for me else continue with this article in sequence.

Method 1: Clear Browser cache/ Use a different browser.

We found that some users cleared their browser cache and they were back to normal. Maybe the problem is with your computer, so we suggest you to clear your browser cache or use another browser. This will certainly fix the issue if the problem is with your computer.

Method 2: Deactivate all plugins

This has been found many times that conflict between two or more plugins results in malfunctioning of certain features. Generally, this happens when we update the plugins. Deactivate all your plugins and see if the editor comes back or not. If it comes then you know that one plugin is causing the issue. Start activating each plugin one by one and check each time if the editor is there or not. This way the culprit can be found.

 To deactivate all plugins at once – go to plugins>installed plugins> select all plugins>deactivate>apply.

Method 3: Installing TinyMCE advanced plugin

TinyMCE is the file which contains your visual editor files or codes. There is another plugin or extended version of TinyMCE which has more features.

Go to Plugins> Add new and search for tinymce advanced, install and activate it. Now refresh and check if the editor is working or not.

Method 4: Replace the TinyMCE folder

Sometimes your visual editor files can get corrupt and may cause malfunctioning of the editor. In this method, we will replace this file with a fresh copy and see if it works.

This method is a bit difficult but if you follow our step by step guide and we will successfully execute this. Now if you use FTP (like FileZilla) or your web server root directory then you are good to go but if not then you must setup FileZilla. I recommend you to use FileZilla because it’s easy and simple.

How to set up FileZilla?

Download the latest version from official FileZilla website. Now install FileZilla on your computer, it is easy to install just take care of the sponsored software which is present during the installation process. Make sure you uncheck those if you don’t want that sponsored software. Once you have installed the software open it and you will see a dashboard similar to the one below.

Now you have to enter few details to access your root files. In the host section enter the domain of your website (eg: www.newtonbaba.com); enter your username and password of your hosting account in the next section respectively. Leave the port box empty and click on Quickconnect. If your login credentials are correct you are inside your server.

Now you have the dashboard of the FileZilla. On the left part it shows your local files and on the right, it shows your server files. Now minimize the FileZilla and follow the next step.

Now go to WordPress.org, at the top right you will see “Get WordPress” click on it and on next page click on “Download WordPress X.X.X” (where x is the version). Once you have downloaded the WordPress zip file, extract it and remember the path because we need it later.

Back to the FileZilla dashboard, on your left browse to the WordPress file which you just extracted. Click on the main WordPress folder and you will see the subdirectories in the below section. Now follow the below path bath carefully –

wordpress > wp_includes > js > tinymce

Now carefully browse to the same tinymce file in WordPress root directory. Follow the below path and we will be there.

public_html > wp_includes > js > tinymce (don’t click on tinymce folder, just expand the js folder and be there).

This is the path to your tinymce file. Right click on tinymce folder on your left and click upload. Now from the popup menu select on overwrite, always use this action and apply to current queue only.

Now this will take a few seconds to a couple of minutes to upload this file. Upon completion, login to your WordPress website in incognito mode and see if it works. If it worked great if not then continue with this article.

Method 5: Configuring wp-config.php file

This is pretty simple as we have already set up our FileZilla this will take just a minute or less. Now browse to the below location –

public_html > wp-config.php and right click on wp-config.php file and then click on view/edit. Now add the below code just after the <?php tag.

define(‘CONCATENATE_SCRIPTS’, false);

Now save and close the file. You will see a popup like below just click on yes.

Now again clear your browser cache and login to your website dashboard and see if it works or not. For most people this method works and you are good to go. But if are as lucky as i was move to the next method.

Method 6: Final method (my method)

Download (if you haven’t) the latest version of WordPress from wordpress.org and extract the file on your computer. Now open FileZilla (if you don’t have FileZilla scroll up and find how to set up FileZilla) and login to your host server.

The most important step –

Now we will download the wp-content folder from your hosting server which contains all your posts, plugins, comments, tags and everything you have created. If anything goes wrong at least we will have all our posts, themes, plugins etc safe with us. Now select the download location by navigating to the location where you want to download from the left side of FileZilla dashboard.

On the right side of your dashboard click on public_html and inside it you will find wp-content folder. Right click on wp-content folder and click on download. This can take some time depending on the size of your website.

Similarly, download the files .htaccess and wp-config.php files which are too under public_html directory.

Now carefully delete all files except wp-content, wp-config.php and .htaccess from public_html folder of your server and wait for the deletion process to complete.

After deleting, from left browse the WordPress folder that we downloaded and from that folder select all files except wp-content and wp-config-sample.php. Now right click on the selection and click on upload. Make sure you upload the files in public_html folder. Again it will take some time to complete. Once the uploading has been finished login to your website in incognito mode and see if you can find the missing buttons. I am sure this will certainly fix the issue.

This was all about how to fix white text and missing buttons in WordPress visual editor. If you get stuck at any step please let us know in the comment section below. And if this helped you in any way, do share it on all your social profiles so that everyone can be helped.