Take the 2-minute tour ×
WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. It's 100% free, no registration required.

I have a blog that I often need to insert iframes into posts for various reasons (don't ask why just trust me!)

When I use the "visual" view to edit my posts the WYSIWYG constatantly strips out my iframes ...

I know I can keep the iframes in the post if I use the "html" view and only view/save from the "html" view ... however I'd really like to be able to use the normal WYSIWYG to edit my post without having to resort to the "html" view.

Is there anything I can do to disable this behavior? I've see this post:

http://wordpress.org/support/topic/wordpress-28-no-more-iframe

Suggsting editing wp-includes/js/tinymce/tiny_mce_config.php but I'd really rather avoid doing something like that that would likely just break in a upgrade!

share|improve this question
    
Post you linked to also has non-edit filter solution by Otto. Had you tried that? –  Rarst Oct 19 '10 at 7:25
    
To clarify a little more, I'd rather not have to hack up some PHP to do it (I'd likely forget about, upgrade and break stuff) ... if it's a settings thing (even if that IS in PHP) or something I can do by say, wrapping a bit of code around my iframe that'd work too. At this point I'm likely going to just use some javascript to do it, but that seems messy. –  Justin Jenkins Oct 19 '10 at 7:28
1  
There is no configuration option for this, and no way to code around it in the editor (it would be a security hole if a workaround existed). Putting the mentioned code in a plugin is the best way to do this, and it will also survive upgrades (plugins are not deleted when you upgrade). –  Jan Fabry Oct 19 '10 at 8:58
    
@Jan, Holding out hope there is someone that knows something we don't know ... If not, thanks. Seems odd that it's a sec hole only on the visual part, not the HTML? I understand it is easier to slip things under people's noses in visual mode ... But still. –  Justin Jenkins Oct 19 '10 at 9:38
    
iframes are useful for embedding videos. The <object> method relies on flash, whereas the <iframe> method, which most video-sharing sites support these days, allows for HTML5 video. –  TRiG Jun 23 '11 at 16:47
show 1 more comment

4 Answers

up vote 7 down vote accepted

If you don't want to write your own code there is a plugin to allow embedding an <iframe>:

Then just use the shortcode like this:

[iframe http://example.com 400 500]
share|improve this answer
    
@Ethan Seifert - Nice answer! –  MikeSchinkel Oct 21 '10 at 8:47
    
I'll take a look, thanks. –  Justin Jenkins Oct 21 '10 at 18:19
    
This really applies to my question, no "hacking" required. While stilling needing to use the HTML view ... Thanks. –  Justin Jenkins Oct 29 '10 at 8:40
add comment

You can customized the filter of the tinymce, see the follow example for iframes and other tags to use Google Maps inside the TinyMCE.

function fb_change_mce_options($initArray) {
    // Comma separated string od extendes tags
    // Command separated string of extended elements
    $ext = 'pre[id|name|class|style],iframe[align|longdesc|name|width|height|frameborder|scrolling|marginheight|marginwidth|src]';

    if ( isset( $initArray['extended_valid_elements'] ) ) {
        $initArray['extended_valid_elements'] .= ',' . $ext;
    } else {
        $initArray['extended_valid_elements'] = $ext;
    }
    // maybe; set tiny paramter verify_html
    //$initArray['verify_html'] = false;

    return $initArray;
}
add_filter('tiny_mce_before_init', 'fb_change_mce_options');

Add this to an custom plugin or functions.php of the theme. Also you can read more informations in my post: http://wpengineer.com/1963/customize-wordpress-wysiwyg-editor/

share|improve this answer
    
@bueltge - Nice answer. I was just on your site reading that very post earlier today. You know, most of the examples on the web for TinyMCE are not in the context of WordPress and when in the context of WordPress it's significantly more complicated. You clearly understand it well. There's a lot more you could cover about TinyMCE; have you considered doing a series of blog posts on it? –  MikeSchinkel Oct 21 '10 at 8:49
    
my greatest problem is the time; but i have an another post baout this topic in my drafts and maybe i post this in the next weeks. Thanks for your tribute. –  bueltge Oct 23 '10 at 8:38
add comment

I had to upgrade to wordpress 3.2.1 and then installed Embed Iframe and it worked great.

The iframe tages were no longer removed when switching back and forth from html to Visual in wordpress.

share|improve this answer
add comment

If you don't like to use an additional plugin for the shortcode solution, you can add something along these lines to your theme, plugin or functions.php to add it by hand. If neccessary you might need to add some more keys to the keys-array.

add_shortcode( 'iframe' , 'mycustom_shortcode_iframe' );
function mycustom_shortcode_iframe($args, $content) {
    $keys = array("src", "width", "height", "scrolling", "marginwidth", "marginheight", "frameborder");
    $arguments = mycustom_extract_shortcode_arguments($args, $keys);
    return '<iframe ' . $arguments . '></iframe>';
}

function mycustom_extract_shortcode_arguments($args, $keys) {
    $result = "";
    foreach ($keys as $key) {
        if (isset($args[$key])) {
            $result .= $key . '="' . $args[$key] . '" ';
        }
    }
    return $result;
}

Then in your post page, usage would be like so:

[iframe width="425" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://maps.google.de/maps?f=q&amp;source=s_q&amp;hl=de&amp;geocode=&amp;q=New+York+City,+New+York,+USA&amp;aq=0&amp;oq=new+york&amp;sll=51.238455,6.81435&amp;sspn=0.373151,1.056747&amp;ie=UTF8&amp;hq=&amp;hnear=New+York+City,+New+York,+Vereinigte+Staaten&amp;t=m&amp;z=11&amp;iwloc=A&amp;output=embed"]
share|improve this answer
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.