I recently encountered a problem where when I went to edit posts on a wordpress site and found myself in a situation where I had a blank editor. No editing buttons and no text. It looked something like the image at the top of this post.
Naturally the first thing a seasoned professional does in such circumstances is go to the university of Google. I have long since stopped storing things in my head when anyone who is computer savvy can generally find the answer to any problem they are encountering. Of course it is necessary that for this to work you need to have a very solid base in computing, but since I do, I can utilize the university of Google strategy very effectively.
So, a quick look and trying a few solutions, and nothing’s working. I’ve done the standard disable all plugins, changed a few settings in the wpconfig.php file, even replaced the directory in which the tinymce editor is stored, all to no avail.
So what next? When you’re at a dead end, you look for for something in logs that helps you. This is an eternal truth that you know by heart after years troubleshooting computer systems.
In this case we can inspect elements in Firefox. This is easy to do on any web page. You simply right click on the web page and choose inspect element to open up the inspector. You have the same functionality in Chrome by the way; it’s part of any currrent browser.
Under inspect element there are various options that allow you to look at every aspect of of a web page. Web pages these days are quite complex, with many elements combining to create the active pages that we are used to.
A bit of background. This site operates via Cloudflare CDN and I’d decided to use Cloudflare to route all my traffic via HTTPS.
Finally I have the information I need to solve this problem. Simply turning off HTTPS until I have addressed the issue of mixed content and I have it fixed. But how do you turn off HTTPS in such a case I hear you ask. Simple. You can edit wp-config.php and add the lines:
define( ‘WP_HOME’, ‘http://www.example.com’ );
define( ‘WP_SITEURL’, ‘http://www.example.com’ );
making sure that the protocol you are using is HTTP.
Altermatively you can go to Settings-> general and change the URL information in the following fields:
So if you’ve tried everything else to fix the WordPress blank editor and it hasn’t worked, give this a try. As soon as you see blocked content, you have got to the root cause of the issue.
The solution to this problem also illustrates the troubleshooting process. Logging and inspection is always your friend. It was instantly apparent once I inspected the page where the problem lay. In this case Google had given me nothing, so I had to take these steps. This is an important skill for anyone who seeks to resolve problems they encounter.
As for turning HTTPS on, that happens after a mixed content search and is a story for another day.