Adding IFRAME Support in WordPress

2 Comments

 

WordPress

Though it is considered an aging bit of code by some designers and developers, not to mention the issues Search Engine Optimization folks have with it, the IFRAME still gets a lot of mileage from various users and resources. By default, the WordPress editor strips out the IFRAME and related tags. This can be a huge frustration and confusion for users that aren’t aware of this as they wonder where their code went.

Like most such practices, this precaution by the developers of the WordPress code has valid reasons, but if you absolutely need IFRAME functionality, it is just a few lines of code away.

The brute force approach would be to disable the IFRAME stripping in the core WordPress files, but we generally recommend against this because you can unintentionally damage the backbone of your site and because it will probab
ly be overwritten or conflict with future WordPress core updates.

Instead, you can add iFRAME support in your current theme’s functions.php file. This way it will persist during WordPress upgrades and you can migrate and replicate it if you use the theme elsewhere. The functions.php file can be found in the root directory of your current theme folder (/wp-content/themes/YOUR_THEME_NAME/).

Simply add the following code at the end of your functions.php (but before the closing PHP tag). Be sure not to add any line-breaks after the closing PHP tag as this can cause problems in some environments.

[code] // ====================================================
// Prevent editor from stripping iframe code
// ====================================================

function mytheme_tinymce_config( $init ) {
$valid_iframe = ‘iframe[id|class|title|style|align|frameborder|height|longdesc|marginheight|marginwidth|name|scrolling|src|width]’;
if ( isset( $init[‘extended_valid_elements’] ) ) {
$init[‘extended_valid_elements’] .= ‘,’ . $valid_iframe;
} else {
$init[‘extended_valid_elements’] = $valid_iframe;
}
return $init;
}
add_filter(‘tiny_mce_before_init’, ‘mytheme_tinymce_config’);
[/code]

Need help implementing this plugin in your WordPress site?  Contact us for our professional services.  We can also provide support & expertise in convenient “blocks” to suit your short and long term needs.

 

 

I'm the front-man of It's WordPress. I come from a diverse array of backgrounds, enjoying the opportunity to expand my knowledge base and skill set by re-inventing myself. I enjoy environments that focus on emerging information, technology and concepts. I put on the technical hat in my early 20s and never really looked back. I'm love technology and the internet, as well as the outdoors and avidly hike, kayak and camp every chance I get.

About Us

We can take you from concept, through design, development and deployment in one seamless process. Whether you choose a self-managed web site or need a continuing support relationship; we've got you covered.

Request Consulation

Ready to transform your vision into a reality? Just looking to see what it takes to get the ball rolling. Tell us about your project and we can help. No spam. No obligation. Just answers.

More from our blog

See all posts
2 Comments
    • Dan
    • May 3, 2012
    Reply

    Is this a security risk in any way?
    Are there any downsides in doing this?

    I notice all the plugins that allow iFrames do so by requireing shortcodes, NOT by disabling TinyMCE from stripping the code.

    Please comment …

    • Reply

      Hi Dan, thanks for swinging by. As far as specific security risks? The first thing that comes to mind is that ANY external content (such as off-site iframe content) is only as secure and trustworthy as the source. I would only embed external content from providers I trusted. Downsides? iFrame content performance will only be as good as the provider/source. If their site is slow or down, your page/post load time will suffer as well. Shortcodes are a very common way of adding inline functionality to WordPress posts/pages. Do you have a specific question about different approaches?

 

Leave a Comment