Christopher's Broom Cupboard Rotating Header Image

Tiplet: disabling TinyMCE's mangling of YouTube embed code

I've been hacking an install of phpns to make it work a little more neatly with my company's web site (which is a real Frankensite and in BAD need of a rip-and-replace).

Anyway, if you use phpns - or any CMS which uses TinyMCE for WYSIWYG text entry / editing - you'll find that if you embed code like YouTube links in code view, switch back to WYSIWYG view, then switch back to code view again... All your lovely embed codes are gone!

This was really annoying me, so I decided to have a hunt about for a quick 'n dirty solution. After lots of forum reading, a few things were clear:

  • TinyMCE won't let you easily disable its code cleaning / HTML verification, which sucks
  • Even the TinyMCE devs aren't quite sure how to efficiently stop this from happening
  • Trying to fully disable its HTML verification / cleanup routines is nigh-on impossible, the codebase is a spider's web of PHP
  • and by default, it hates all <object> and <embed> tags, even if you have the TinyMCE Flash plugin installed.

This can royally screw with your meticulously-entered YouTube embeds. However, on his blog, Akbar neatly demonstrates a simple but effective method to stop TinyMCE eating your embed code - and all you need to do is add the object and embed tags and possible variables... There's a full demo, with borrowable code, on his web site.

Leave a Reply