Embeds in WordPress: The Easy Way to Include Media

A cat video on YouTubeI frequently get clients who mention one feature they want is the “Ability to easily embed videos on their site.” So long as they’re willing to use a third-party service (like YouTube, Vimeo, or even VideoPress), this is just about the easiest thing in the world to do with WordPress.

Here’s the “code” to embed a YouTube video in WordPress:

http://www.youtube.com/watch?v=KIePsbJSS04

Yup. That’s it. Copy the URL, paste it on its own line, and voilà! Video.

Is it just for YouTube?

Nope! WordPress supports lots of services and keeps adding more. They do this by supporting an independent standard called “oEmbed” that lets you easily embed media from one site on another.

Here’s the full list of embeddable websites on the WordPress Codex. It includes other popular services like Vimeo, Twitter, Hulu, Scribd,1 Instagram, and more!

Why Isn’t It Working?

Unfortunately, there are a few small but tricky caveats. As I mentioned, the URL to embed must be on its own line. This means that:

  • The URL must NOT be a link. It should just be plain, unclickable text.
  • You can’t align the URL. (If you do, then there’s additional formatting added to the URL and it’s no longer “on its own line.” This is a pretty irritating technical caveat.)
    • If you do this, you must use the “Remove Formatting” button to fix it or just delete the link and start over.
  • It won’t work for all URLs. For instance, if you try to use the URL from YouTube’s embed code (e.g. http://www.youtube.com/embed/KIePsbJSS04), it won’t work. Make sure you’re using the most “vanilla” version of a URL if you’re having trouble.

Advanced Embedding & Work-Arounds

If you do need to align your embedded media or change its width or height, you can use the embed “shortcode” (but remove the space after the “[” to make it work):

[ embed]https://www.youtube.com/watch?v=KIePsbJSS04[ /embed]

That will embed a shortcode for sure, no separate-line needed.

To set a specific size, use:

[ embed width="100"]https://www.youtube.com/watch?v=KIePsbJSS04[ /embed]

Now, your cat videos will be kitten videos. You can use “height” just like “width” in the example above.

UPDATE, April 9, 2013 3:01pm PST: My good friend Mike alerted me to the fact that the above examples weren’t working. That was a bummer and the should be fixed. However, it also reminded me the popular Jetpack plugin interferes with the embed shortcode used above. This means you have to use their special shortcodes ([youtube], [vimeo], etc.) instead of [ embed ] if you need to change the video’s size.

Why Shouldn’t I use the Website’s Embed Code?

YouTube Embed Code Generator
Why would you want to deal with this?

Good question! Many websites offer their own HTML embed code that you can copy and paste into your post. This will work, but I don’t recommend it for a few reasons:

  • The WordPress was is shorter and faster. Pull up what you want to embed, copy, and paste.
  • It’s easy to accidentally break HTML code that you put in the WordPress post editor.
  • If a service changes their embed code (which happens all the time), a new version of WordPress will take care of using the newer and improved embed code.

Cat Video

Yeah. That example video. It’s a cat video. Of course. You’ve suffered enough with words, so just sit back and enjoy the fruits of WordPress and YouTube synchronicity:


Coming Soon! Easy Hosted Audio & Video Embedding

WordPress 3.6 is currently scheduled for release on April 29. One of the exciting new features it brings is the ability to insert audio and video files straight from your WordPress media library into the WordPress editor. Previously, doing this would only insert a link to the file. You needed a plugin to make them playable directly on your site. I still think there are some great reasons to host your video and audio files on third-party sites like YouTube—where you get free really fast hosting and access to their huge audience—but this will open up another easy option for people who want to show videos on their site.

If you’re in Seattle and liked this feature preview, come here me talk this Thursday at 6:30pm with Bob Dunn at the WordPress Seattle Meetup about the other upcoming features in WordPress 3.6.

Join the Discussion