Have you spent hours crafting the perfect post, embedding different media from the likes of Youtube, Facebook and Instagram, as well as included proper schema mark-up for Google and other search engines to use, only to switch over to the WordPress visual editor and lose it all?
I have.
Most people use the visual editor in WordPress. That is generally fine, and it provides a nice interface in which to write. The visual editor also enables easy access to the formatting tools that WordPress has available.
However, I like to work in the Text version of the WordPress editor. This editor provides simplified access to the different formatting tools (bold, blockquote, etc) but also lets you easily add other types of HTML to your article. This includes schema for structured data, like HowTo guides, FAQs and videos.
Google and other search engines can read this schema, and use it to better understand the content you are offering.
The first problem is that if you try and paste or insert that type of HTML code into the Visual editor, it will become garbled. OK, you might say, that’s no problem, I’ll just work in the text editor.
However, a larger and more annoying problem can occur if someone else, say a content editor for your articles, comes in and edits your article (maybe adding better images or tags) in the Visual editor. As soon as they load your article, along with its painstakingly crafted HTML, in the WordPress Visual editor, your HTML will most likely become corrupted or simply disappear. This renders it worthless and means that either your embedded content won’t load correctly, or your schema will be invalid and therefore unreadable and ignored by Google.
An exacerbating factor can be if you don’t revisit the said article for a long period of time – both you and your editor could be none the wiser that your schema HTML, which is meant to be working silently in the background, is no longer doing so. I grappled with this issue for several years until I came across the following piece of code, which you should insert into the functions.php file of your WordPress theme (ideally the child theme):
// html will not be removed from editor
function override_tinymce_option($initArray) {
$opts = '*[*]';
$initArray['valid_elements'] = $opts;
$initArray['extended_valid_elements'] = $opts;
return $initArray;
}
add_filter('tiny_mce_before_init', 'override_tinymce_option');
Use that code sinppet in your functions.php and even if you switch between the visual and text editors, your precious structured data schema and other HTML will remain in tact.
