Stop WordPress From Removing HTML

Anyone who has worked with HTML in WordPress knows that wordpress has a nasty habit of filtering out html tags/elements that you have specifically placed in the HTML editor. Many claim this is wanted behavior, but we all know this behavior is about the most annoying thing about WordPress and other blogging systems. So let’s fix that.

While there are many ways to stop WordPress from filtering html, I believe the most unobtrusive way to achieve this is to define custom tags that wordpress will pretty much leave alone. Originally I was modifying core WordPress files, but after a little digging I found out how to hook on to variables that have been generated in the core, and add to them. This way you aren’t messing with important things (too much), and your changes will persist through WordPress updates!

Without further ado, simply add this function to your functions.php file in your theme’s directory, changing <<yourtag>> appropriately:

function my_valid_elements($initArray) {
	$initArray['extended_valid_elements'] .= ',<<yourtag>>[*],<<yourtag2>>[*]';
	return $initArray;
}
add_filter('tiny_mce_before_init', 'my_valid_elements');

After that is done, the visual editor will no longer filter out your innocent html tags.

Notes:

  • WordPress will still change all attributes of your html to lower case. If you have a plugin that requires case-sensitive attributes, you’re still out of luck :-(
  • WordPress will still modify certain tags. For instance, I couldn’t figure out how to stop it from converting <image> to <img attr=”"> despite an hour of searching through code
  • Special thanks to Engfer at www.engfers.com,¬†and many others who have posted similar code!
This entry was posted in Blog. Post a comment or leave a trackback: Trackback URL.

5 Comments

  1. Steve
    Posted March 12, 2013 at 8:02 am | Permalink

    thats great, but do you know how to enabling this for meta_boxes ?

    • Brent Grossman
      Posted March 14, 2013 at 11:30 pm | Permalink

      Hey Steve, I’m not quite sure what you’re trying to accomplish. What do you mean by “enabling this”? What is your expected result vs your actual result when dealing with meta_boxes?

      Personally, I don’t have any experience in meta_boxes, but I’d be glad to do some tinkering :-)

  2. Steve
    Posted March 15, 2013 at 7:14 am | Permalink

    hey brent, well currently i have qTranslate plugin and i want to use shortcode tags or html, in the themes slider post options which is a wordpress meta box, but every thing gets stripped out..any ideas?

    • Brent Grossman
      Posted March 16, 2013 at 11:56 pm | Permalink

      Ok, so I did some digging. I didn’t come up with the exact thing you’ll need to do, but I can definitely point you in the right direction.

      What the code in this post does is modifies a filter before it’s run. The reason why it’s not working for you is because it’s not modifying the filter for meta boxes. Finding what filter this is, is the hard part. I couldn’t find it with some digging, but I did find a filter API that you can hopefully use to find it (either by trial and error or by trying to understand how and where these all are used). You’ll find the API here

      To change what filter is modified, just change the text ‘tiny_mce_before_init’ to the name of the filter you think needs modifying.

      Let me know what you find! Good luck :-)

  3. Posted August 26, 2014 at 12:44 pm | Permalink

    Thanks a lot, this solved my problem :-)

Post a Comment

Your email is never published, nor shared. Entering your website is optional, but good for networking!

*
*

Available HTML
<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>