5/01/2013

TinyMCE: Editor won't accept / deletes IFRAME code.

The Problem: You might be using TinyMCE as a text editor on your form, or on some content management system like MovableType.
And you are trying to embed some kind of video or audio code onto the page. But every time you do, TinyMCE deletes the code.

If the embed code is for an <iframe> then you may have to add a line to TinyMCE's configuration script to get it to work.

Example: You want to embed a YouTube video.

You click on [Embed] under the video and it gives you code like this:
<iframe width="560" height="315" src="http://www.youtube.com/embed/LvkITsb9fA0" frameborder="0" allowfullscreen></iframe>
Your TinyMCE editor won't accept it for some reason.

Quick Solution #1 --

See if your embed source -- YouTube in this case -- provides alternate code.
YouTube offers a checkbox that says: [x] Use old embed code:
<object width="560" height="315"><param name="movie" value="http://www.youtube.com/v/LvkITsb9fA0?version=3&amp;hl=en_US"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/LvkITsb9fA0?version=3&amp;hl=en_US" type="application/x-shockwave-flash" width="560" height="315" allowscriptaccess="always" allowfullscreen="true"></embed></object>

Better Solution #2 --

Depending on your TinyMCE setup, you'll have some code that can be configured to add or subtract buttons and features.

The feature you want to add is put into place using this line of code:
extended_valid_elements : "iframe[src|width|height|name|align]",

Specific Fix: MovableType TinyMCE plugin.

There are a couple of different TinyMCE plug-ins for MovableType 4.

If you are using this one -- https://code.google.com/p/tinymce-mtplugin/ -- you will have to find this file

  • /mt-static/plugins/TinyMCE/js/initialize.js
There may already be one exteneded_valid_elements in place for form.
Add the line of code (specified above) after the existing one for the form -- there can be multiple entries for this setting.

No comments :

Post a Comment