Whether the goal is to get your message put across in different ways, engage with web site visitors using richer media, increase visiting time spent on single blog posts, or simply to provide more value for readers and search engines, embedding multimedia into WordPress blog posts is a smart idea. In this article I will explain how to include some of the more common and popular forms of embeddable media into blog posts.
In most cases, embedding content into posts (or pages) is as simple as pasting the link, on it’s own line, into the content area. This auto-embed feature was part of WordPress since version 2.9 and has been a feature that was automatically enabled ever since version 3.5. If you want to control the maximum height and width of an embed and allow other content to surround it, i.e. not have it on it’s own line, using the “embed” shortcode can accomplish that.
The old school approach for embedding used to be to get the HTML embed codes from the site hosting the content and pasting it into the content area.Now, with the embed feature of WordPress this is accomplished for you in most cases. The oEmbed protocol is the technology used to attempt to fetch the HTML automatically. But, what if oEmbed doesn’t work, or if you want more granular control than just height and width? Below are some simple steps for embedding media the “old school” way.
Embed YouTube videos
First you visit the video on YouTube that you want to embed. You should have a rough idea of the width of the content area of your site before choosing a size. You can also manually edit the size values by entering a width and Youtube will auto-calculate the height to maintain aspect ratio.
YouTube -> Share -> Embed
You are given the options to “show suggested videos” at the end of playback, whether you want to wrap a layer of encryption around the content (HTTPS), whether Google can store cookies on the machine of the user watching the video through your site, plus you have the option to use the old embed code. Based on your selections, the embed code will change. When complete, copy and paste that code into the Text view of the content window in WordPress.
- You have the option to change a few of the settings including alignment, and theme and color. The width is responsive and should resize appropriately based on the size of the container that it is in.
Embedding Storify stories
Embedding stories from Storify into WordPress posts and pages is a very similar process to that of YouTube videos and Twitter Tweets. Right near the top of the page is a set of buttons. The button on the far right has the embed symbol. When clicked, the embed code appears. Copy the embed code and paste it into the content area of the post in Text view. Providing there are no code restrictions (if on a hosted WordPress site for example), this should be all that is needed to do to embed the story.
Other media embeds
Embedding other media into WordPress will generally follow the same steps as presented above. You simply set the “share” or “embed” settings, if available, and copy and paste the code. As mentioned, WordPress will attempt to embed automatically upon seeing just a URL and it does a pretty good job of it most of the time. The following media types are meant to be supported using the oEmbed protocol within WordPress, at the time of this writing:
- Flickr (both videos and images)
- FunnyOrDie.com (WordPress 3.0+)
- Instagram (WordPress 3.5+)
- SlideShare (WordPress 3.5+)
- SoundCloud (WordPress 3.5+)
- SmugMug (WordPress 3.0+)
- Twitter (WordPress 3.4+)
- Vimeo (note older versions of WP have issues with https embeds, just remove the s from the https to fix)
The easiest way to test if it works is to just paste in the URL on it’s own line and preview the post.