Sep 05
Yesterday I stumbled upon an issue concerning WordPress’ tendency to strip out certain HTML tags, using its wptexturize() function. After a google search for the best solution, I came across two alternative solutions of implementing shortcodes into the post or page and get WordPress to parse these shortcodes along with the iframe that the shortcodes point to. These functions are to be pasted in your functions.php file.
This post is a reference for the beginner to intermediate WordPress user who isn’t aware of this. The possible solutions are illustrated below:
RETRIEVING VALUE FROM CUSTOM FIELDS
This solution is based on a script by Vividvisions, which utilises WordPress’ custom fields.
function field_func($atts) {
global $post;
$name = $atts['name'];
if (empty($name)) return;
return get_post_meta($post->ID, $name, true);
}
add_shortcode('field', 'field_func');
In order to use this, you must create a custom field value of whatever name you wish and using the shortcode [field name="name-of-your-custom-field"], the code in the custom field that you have created will be extracted.
THE IFRAME SHORTCODE
This solution is much more specific, utilising the WordPress Shortcode API:
function iframe_shortcode($atts, $content=null) {
extract(shortcode_atts(array(
'url' => '',
'scrolling' => 'no',
'width' => '100%',
'height' => '500',
'frameborder' => '0',
'marginheight' => '0',
), $atts));
if (empty($url)) return 'http://';
return '<iframe src="'.$url.'" title="" scrolling="'.$scrolling.'" width="'.$width.'" height="'.$height.'" frameborder="'.$frameborder.'" marginheight="'.$marginheight.'">'.$content.'</iframe>';
}
add_shortcode('iframe','iframe_shortcode');
To use this, simply create an iframe shortcode with the relevant attributes:
[iframe url="http://www.graphicbeacon.com" width="100%" height="500" scrolling="no" frameborder="0" marginheight="0"]
GuideCloud has created a plugin for those interested, making use of this similar code, except he has wrapped this around a php class object. Check that out if you want a plugin alternative instead.
Although both functions work well, I would recommend the first one, as this uses less code and is more flexible, making your custom fields panel a bit more useful 
. All the best.
5 Comments to “Embed an Iframe into a post or page without using a plugin”
Subcribe
Recommended
September 23rd, 2010 at 4:53 pm
[...] neajuns al editorului WordPress altfel decât printr-un plugin două recomandări de articole : Embed an Iframe into a post or page without using a plugin și Customize WordPress WYSIWYG Editor. Tweet [...]
October 15th, 2010 at 11:26 pm
Hi,
I was needing something similar. I found a simple solution that works for me:
<php
$temp = get_post_meta($post->ID, '_custom_field', TRUE );
$temp = str_replace('<','',$temp);
$temp = str_replace('&','&',$temp);
$temp = str_replace('"','',$temp);
echo $temp;
?>
Hope this help someone.
Camilo
October 16th, 2010 at 10:33 am
@Camilo what exactly is this code supposed to do? I dont see the point in replacing ‘&’ with another ‘&’ . Kindly Elaborate?
November 3rd, 2010 at 7:49 pm
Real nice !!!
Been looking all over for this.
Now it just works, wow.
Nice.
February 3rd, 2011 at 3:04 am
great tip, I used the custom field solution. takes about 2 minutes to implement and fixes the solution for any html problem. the Vividvisions site has a good graphic for us beginners on what the custom field should look like.