» Have Code Your Way in the Wordpress Editor

So I was half way done building out a Wordpress CMS website in which I was using div class tags and inline styles inside the editor. What I soon realized is that Wordpress was removing all of code and breaking my pages. So I searched the Wordpress forums and sure enough I wasn’t alone.

Several other Wordpress users were experiencing the same thing many griping about how dare WP change my code.. and why isn’t this fixed yet. The questions were answered like this from a Wordpress moderator…

Wordpress is designed as push button publishing for the non technical / non coding person. For this reason certain code or tags are not allowed to protect these users. If you want to have your code then turn off the visual editor.

This answer is helpful but it disn’t solve my situation. I have not problem with using only the code editor.. but that doesn’t work for the team of editors I work with… they don’t know code. So I needed to somehow fix the problem. This Thread I found in the WP Forum was helpful in fixing my issue… the downside is you have to hack core code.

The Fix is outlined below so people don’t have to sift through the tread to figure things out.

*** CAUTION: THE FOLLOWING REQUIRES CHANGING CORE FILES. PLEASE BACKUP EVERYTHING! ***

In file wp-incluede/js/tinymce/tiny_mce_config.php about 24th line, find:

$valid_elements = ‘p/-div[*],-strong/-b[*],-em/-i[*],-font[*],-ul[*],-ol[*],-li[*],*[*]’;

replace with:

$valid_elements = ‘-strong/-b[*],-em/-i[*],-font[*],-ul[*],-ol[*],-li[*],*[*]’;

Another issue is the “Post Formatting” issue, wordpress will add

tag inside the tag

when you brows the post,
so you have to hacking the file: wp-includes/formatting.php
about 66th line find:

$pee = preg_replace( ‘|

(
]*>\s*)|’, “$1

”, $pee );

and comment it out.

After you apply both of these hacks you may find that your wp editor goes away… both visual & code view buttons.. all you are left with is a text box that will except code.

Install the following plugin for an alternate wysiwyg editor
Dean’s FCK Editor

That’s It! Remember.. If you apply this hack.. you have to apply it every time you upgrade your installation of Wordpress.