Vimeo’s new iframe embed code

As a follow-up to a previous post about embedding Vimeo videos and having them work on Apple’s iOS devices (iPhone, iPad and iPod Touch), Vimeo just announced their Universal Player which will deliver the appropriate video format for the device being used. Vimeo’s FAQ page has more info on it, but the new method uses an <iframe> HTML tag to frame in the content, and the player will detect the device to serve the right video file. YouTube has recently rolled out something similar. Vimeo’s code looks like this (line breaks were added):

<iframe src="http://player.vimeo.com/video/12345678?title=0&amp;byline=0&amp;
portrait=0&amp;color=CC6600" width="640" height="360" frameborder="0"></iframe>

I did some quick testing and it worked fine. Both the iPad and iPhone were delivered h.264 versions, while Mac and PC still get the standard Flash player. I would like to see Vimeo offer some embed options to include serving straight HTML5/h.264 to the desktop as well and avoid Flash altogether.

WordPress doesn’t like the <iframe> tag, so if you’re using WP you will need to install the Embed Iframe plugin. In my testing this plugin has supported the new Vimeo method within a WP post. I have a test page here where I embed two videos, the first one using the new iframe code and the second one with the earlier javascript workaround.

Posted: August 18th, 2010
Filed under: Handheld, Innovation, Mobile, Video Tags: , , , , | 6 Comments »

6 Comments on “Vimeo’s new iframe embed code”

  1. 1 Matinciel said at 11:54 am on September 1st, 2010:

    Hi,
    I still trying to use the Embed iframe plugin without succes. The plugin ignore the size I give him.
    Could you please tell me your code ? (last wordpress version)

    [iframe url width height]

    Whatever width height the size is the same (small)

  2. 2 Stacy said at 12:38 pm on September 1st, 2010:

    Don’t use the [iframe url width height] code as specified in the plugin. Instead, use the iframe code from Vimeo. You can edit the video dimensions in there, just change the width & height values to whatever you want.

    Stacy

  3. 3 Matinciel said at 1:35 pm on September 1st, 2010:

    Thanks !

  4. 4 Tom said at 10:43 pm on September 2nd, 2010:

    I have a joomla site that also doesn’t like the tag. Is there a workaround for this so that I can get my vimeo videos working on the iPhone using the new universal player?

  5. 5 Stacy said at 7:27 am on September 3rd, 2010:

    Tom: I’m not familiar with the Joomla platform but I did a Google search for “Joomla iframe plugin” and found some resources. Looks like there should be a way to make this work. Here’s one, you might check the user community and see which ones have good ratings:

    http://extensions.joomla.org/extensions/style-a-design/popups-a-iframes/4144

  6. 6 Darzh said at 1:20 am on April 6th, 2011:

    Thanks – been looking for how to put the parameters in the src section for a while! :)

Leave a Reply