WordPress Visual/Text Editor Formatting

By June 11, 2014 Design, Programming No Comments

If you work with WordPress you probably have a good idea what I’m going to write about today just from the title: formatting issues when switching between the visual and text editor.

For those whom may not be familiar let me give you a quick scenario to describe what I’m writing about:

You’re a developer/designer working in WordPress. Beyond chiseling out the shape of your clients vision in the theme code you’re also working in page content. The page content has been provided to you in a handy Word document. Obviously you’re on a budget, so you quickly copy the text from the Word doc, paste it into the visual editor, and make some styling adjustments.

Great! Now you need to jump into the text editor to add some paragraph tags to get the behavior and appearance you need. You’re on your way, and jump back to the visual editor and BAM…all of your formatting has been stripped out.

The WordPress visual/text editor can create serious frustration at times. While it’s easy for a WordPress guru to simply jump into text view, make their updates and move on, most clients will gravitate toward the visual editor. Once they make the switch there is a good possibility your formatting could be wiped out.

TinyMCE Advanced Plug-in to the rescue! This nifty plug-in not only expands on the native visual/text editor, it also provides you with the ability to customize the editor to your liking. Drag and drop visual styling buttons to and from the toolbar – you can even customize the editor styling!

As for our little scenario above? In the settings for TinyMCE Advanced, scroll to the “Advanced Options” and check the box next to the option to stop removing paragraph and break tags. That’s it: simple and effective.

The Wrap

TinyMCE Advanced Plug-in is a great solution to those pesky visual/text editor issues while also allowing yourself and your client to customize the editor functionality.