WordPress Plugin - IFrameWidgets

(4,020 views)

Current version: 1.0 (29th January 2008) | Read The Changelog
Download (downloaded 429 times) | RSS feed icon Subscribe To IFrameWidgets News

IFrameWidgets allows you to place javascript widgets in an IFrame, so they won’t stop the rest of the page from loading if they load slowly or hang.

Features

The plugin creates IFrame widgets, which are similar to Text Widgets, except output is created in an IFrame (in the sidebar).

The benefit of placing slow loading widgets in an IFrame is that IFrames load in parallel to the rest of the page. If the widget loads slowly or hangs, it won’t stop the rest of the page from loading. Other features include:

  • Widgets remain hidden until they are completely loaded, then appear in whole. If they don’t load, they won’t take up any space on your sidebar.
  • Up to 9 IFrame widgets can be enabled, but you don’t have to use them for all your widgets, just the ones that are loading slowly.
  • Caters for the BUMPzee widget php code (other php code won’t work).

Want to see it in action? You can, right here on my site. The BUMPzee, MyBlogLog and BlogCatalog widgets are all running in IFrame Widgets.

Note: although the rest of your page will continue loading and will not be held up by slow widgets (meaning it shouldn’t break the display), your browser will not say the page is Done until the slow widgets have finished loading (or given up).

Limitations

There are two limitations to the plugin:

  • Referrer Information: If the widget service website records which pages the widget is loaded on, it will receive inaccurate information (it will think the widget is on the IFrame page, not your actual post). This does not appear to be a problem for most widgets. See the Compatibility section below for any known issues.
  • XHTML Transitional Validation: The plugin will cause two validation errors: one because it uses allowtransparency=”true” to get a transparent background in IE; the other because it uses onload (in the IFrame) to change the IFrame height when it’s loaded (so you don’t have to specify the height in pixels).

Browser Support

Tested in Firefox, Internet Explorer 6 and 7, Opera and Safari.

There is one issue in Opera: The IFrames are supposed to appear when the content in them has fully loaded. Opera does not recognise the IFrame onload attribute as it’s not valid XHTML. As a result, if something holds up the page, none of the IFrame widgets will appear until everything has loaded or given up (then they will all appear).

Compatibility

This is a list of widgets known to have been used with the IFrameWidgets plugin and any issues encountered. Other widgets will be added to the list as I become aware of their status. If you use the plugin with a widget not on the list, please give me some feedback (via a comment), so I can update this.

  • BUMPzee: Accurately shows who has been visiting your site, but doesn’t record page view stats properly (the figures for This Page and Blog Total will be the same). This does not affect your visitors, only your stats. Scott from BUMPzee is looking into a way to address this.
  • BlogCatalog: There are no known issues. BlogCatalog report that they do not use the referrer information (see limitations) at this time.
  • MyBlogLog: Accurately shows who has been visiting your site. There should be no issue relating the use of http_referer IF you get the Stats Tracking Script from the Widgets section of the MyBlogLog website and enter it in the Tracking Code option in the IFrame widget.
  • Blogrush: There are no known issues.
  • Alexa: Displays correctly. However, no one is sure if the Alexa Widget records traffic to your site. If it does, then it may not record traffic properly if its in an IFrame.

Requirements

Should work on any WordPress version with support for WordPress widgets. Tested on WordPress 2.3.1, 2.3, 2.2.2 and 2.1.3.

Installation

  • Download the iframewidgets-1.0.zip file and unzip it.
  • Upload the iframewidgets folder to your site’s wp-content/plugins folder.
  • Activate the plugin within WordPress.

Upgrade

To upgrade simply follow points 1 and 2 from the installation instructions.

Usage

Once the plugin has been activated, go to the Widgets page on the Presentation menu. There will be a widget called IFrame 1 in the Available Widgets area. Drag this onto the sidebar where you want it to appear.

Once on the sidebar, the widget will have icon on the right hand side (a blue line with three black lines underneath it). Click this to set the widget up. You can define the following:

  • Title: This is optional. You probably don’t want this for most widgets.
  • Width: This can be left blank for most widgets (the IFrame’s width will be 100% of the sidebar’s width).
  • Alignment: Choice of Your Theme’s Default, Left, Center or Right.
  • Tracking Code: This is optional and is meant to negate the http_referer issue (see Limitations section). This will come from the site who created the widget. At present only MyBlogLog offer a tracking code.
  • Widget Code: This is where you enter the code for the widget you are trying to add. This will come from the site who created the widget (eg BUMPzee, MyBlogLog, BlogCatalog, etc).

When you’ve finished entering the data, close the widget setup screen, then click Save Changes.

If you need more IFrame widgets, you can add more (up to 9) in the IFrameWidgets area near the bottom of the page. Simply set how many you want and click Save.

Support

This plugin is officially not supported (due to my time constraints), but if you leave a comment below or contact me, I should be able to help.

Acknowledgements

A big thanks to Scott Jangro from Bumpzee and Daniel from BlogCatalog for getting involved and quickly making changes which have made this plugin feasible. Also a big thanks to Andy Beard for getting involved and making things happen.

The code to register and setup the widgets is based on the GAdsense plugin by Otto from http://ottodestruct.com/. Thanks to Otto for his many contributions to the WordPress world, especially this one.

IFrames are not new to me, but I wasn’t sure if social widgets would run in them. Earl Moore’s Keeping javascript widgets from controlling your blog post told me they could.

To provide software, you need people willing to bravely step in and test the beta version. Thanks go to the following people for their valuable feedback:

Subscribe To Site:

Like the plugin? Buy Me A Drink! Make a donation and get your link listed below.

Share and Enjoy: These icons link to social bookmarking sites where readers can share and discover new web pages.
  • StumbleUpon
  • PlugIM
  • Sphinn
  • Digg
  • del.icio.us
  • Netvouz
  • MisterWong
  • Bumpzee
  • Reddit
  • Technorati
  • co.mments

17 Comments

  1. So far so good, and it works on 2.3.

  2. […] their blogs from getting clogged down. Well, if you’re on WordPress, help is at hand with the IFrameWidget plugin. This handy plugin lets you insert your widget into an iframe that you can drag & drop into […]

  3. […] see if his plate is full or not. He's the author of the DualFeeds plugin, which I use and the IFrameWidgets plugin, which I don't (because my theme doesn't have widget […]

  4. […] Visit […]

  5. […] all the widgets. Another reason for doing all this work is so that I can use Stephen Cronin's IFrameWidgets plugin to prevent JavaScript widget slowdowns. I should be getting to that as soon as I finish the […]

  6. Hey Man,

    I have to say I really like you blog - as a blogger myself I read a LOT of blog, and yours has really caught my eye. Keep up the good work!

    I’m going to try this plugin - sounds great to me. While we’re on the topic of plugins, your poll (don’t know if this is for you or a sponsor), but the answer I would choose is; if the plugin is free than it’s fine to have a link and name- -why would you expect to get something for free without giving something back? If it was a full priced plugin, then it should be your option to remove external links (publisher name could be hard coded, just as the Audi symbol is on your car, or Oreo is on your box of cookies).

    And lastly, just a suggestion - I tried to subscribe to your feed via email (I get a lot of my content on my phone, no RSS reader), and couldn’t - wasn’t presented the option - and if it’s there, I didn’t see. I clicked the “dual feeds” banner top right. You should add email as an option - don’t wanna miss out on any potential readers…

    Bookmarked your page - I’ll be back!

    Ty

    1. Hi Tye,

      Thanks! I just had a quick look at your blog and it looks pretty good. I’ll be back over there when I’ve caught up on my comments here.

      Thanks for the feedback on the poll - it’s an old one I added when I was considering adding links to one of my plugins (DualFeeds). In the end I didn’t, but that was more for design reason than ethical ones. I need to get a new poll as that one’s been there for ever…

      At the moment, I don’t have a subscribe via email option. It’s been on my list to do for a long time, but I’m really busy at the moment. I’m planning to add the link to the DualFeeds plugin at some point too, but I’ll probably add a separate link on my blog first.

  7. Thanks for this great plugin. I was just about to remove several widgets because they hung-up my site. This couldn’t have come at a better time for me.

    I just uploaded and am using it. It works GREAT!

  8. Hi DeadRooster, Thanks - I hope it keeps working great!

  9. Lots of useful plugins you’ve created here! I’m trying out dual feed and this one.
    I’m sure it’ll be great!

    1. Hi Louis, Thanks. And can I just say, that the icons you use for full and partial feeds are just fantastic!

  10. This plugin ROCKS! what an improvement I’ve seen using it… Great post!

    1. Hi Ty, Glad it helps! Nice blog by the way…

  11. Stephen,
    FYI this does not work with wordpress 2.5

    1. Hi Eaglehawk,

      Thanks for letting me know. I knew there was a chance it wouldn’t work because the way widgets work has changed in 2.5. I was planning to look into it earlier, but I’ve just moved country and I am so busy as a result.

      I’ll try to get this fixed in the next week or so..

      1. Stephen,
        Not trying to rush you or anything, but any update for 2.5?

        1. Hi Eaglehawk,

          Feel free to chase me! I’ve been very busy, so this had slipped to the back of my mind. It’s now at the fore front and I’m hopeful of a new version by the end of the week (sooner if possible). Sorry!

Leave a comment

Rules: Leave your name! Enter YourName@YourKeywords and KeywordLuv will use YourKeywords as the anchor text. No inappropriate or offensive comments. No links to inappropriate or offensive sites. Comments must contribute to the discussion.

KeywordLuv

This site uses KeywordLuv. Enter YourName@YourKeywords in the Name field to take advantage.


WordPress Plugins by Stephen Cronin
DualFeeds: Offer both full text & summary feeds. Let your readers choose!
IFrameWidgets: Stop slow javascript widgets breaking your page layout!
FeedEntryHeader: Add a copyright statement to the TOP of your feed!
LocalCurrency: Show currency values to readers in their own currency!
KeywordLuv: Reward your commentators with keyword rich anchor text!