Responsive Video for WordPress
The content you display on your website can make or break its success. While written content is still a popular means of connecting with your audience, it’s not the only one. In fact, ignoring other forms of content can mean you’re missing out on untapped pockets of potential customers.
Video – specifically responsive video – can add depth to your website. It can improve User Experience (UX) greatly by providing additional interaction, and it enables you to reach out to a whole new subset of your target audience.
In this post, we’ll define responsive video and how it can be used on your WordPress website. We’ll then outline the video embed process, both the manual and automatic (plugin and theme) options. Let’s get started!
What Is Responsive Video?
In a nutshell, responsive video is a web design element that responds appropriately to the browser or device it’s displayed on. By embedding responsive video on your website, you can ensure that all of your users have a similar viewing experience.
Of course, the main benefit of responsive video is the ability to display across multiple browsers and devices. Since responsive video is able to adjust to the display, you don’t need to necessarily worry as much about mobile optimization. What’s more, it directly impacts UX.
One thing to keep in mind is that not all embedded videos are responsive. While non-responsive videos still offer value, they can alienate mobile users and impact both traffic figures and bounce rates. For this reason, we strongly recommend using responsive video where possible.
Responsive Video Players for WordPress
There are a variety of video player platforms found across the web, and many are compatible with WordPress, including YouTube, Vimeo, DailyMotion, and Hulu. However, even lesser-known platforms (including VideoPress, WordPress.tv, and Cloudup) are supported. Of course, the final three are all products by Automattic – the developers of WordPress.
Responsive YouTube Video
As the world’s most popular video platform, it’s no surprise that WordPress would integrate effortlessly with YouTube videos. In fact, it’s perhaps one of the easiest video formats to embed into your WordPress website.
In addition, embedding YouTube videos enables you to link out to the source URL, and includes various playback options that are all customizable. Let’s take a closer look at how to embed responsive videos in WordPress.
Embedding Responsive Video in WordPress
In fact, there are two options for embedding responsive video in WordPress. First, you can simply add the video’s URL into the editor of a post or page. If the site is supported by WordPress, this will automatically turn the URL into an embedded video, with no further action needed on your part.
Secondly, you can surround your URL with the [ embed ] shortcode. This enables you to control the display size of your embedded video:
However, neither of the above methods will ensure that the video is responsive unless you’re using a theme that supports responsive video. To ensure that all of your videos are responsive, you’ll need to turn to plugins and themes. Let’s take a look.
Responsive Video Plugins
Plugins are software that extend the functionality of WordPress. For this purpose, there are a number of plugins that enable you to easily embed responsive videos within your WordPress website. In addition, you’ll also get additional benefits, such as playback customization and style controls. Let’s look at two popular options.
First up, ARVE Advanced Responsive Video Embedder uses a one-click embed button that works with an array of video platforms (including YouTube, DailyMotion, Facebook, Vimeo, and even TED Talks). Additionally, the premium version of the plugin enables you to disable embedded video links and use lazy loading functionality:
Another option is YouTube Gallery by YouTube Showcase. Predictably, this is a YouTube-specific plugin, but one that makes all of your embeds responsive. What’s more, you can add videos to your website in a gallery- or grid-style display.
There’s no doubt that the above two plugins are helpful. However, if embedding responsive video is central to your site, a dedicated theme may be more fitting.
Responsive Video Themes
While plugins are certainly a popular option, themes are a great alternative for media-heavy sites. While all WordPress themes support video embedding, they don’t all support responsive video. This is a crucial difference, as non-responsive embeds will display poorly on mobile devices.
NewsMag is a magazine-style theme that can be used to incorporate written content, audio, and responsive video. The free theme is currently used by thousands of WordPress users, and its variety of customization options makes it a great choice for bloggers of all types.
Excellent is a theme with a high-quality design, which also enables you to streamline the way you embed videos. Excellent also offers much in the way of customization (such as color options, navigation and social menu options, and more).
There are also premium themes that offer responsive video functionality, and additional features. For example, the Video theme enables you to seamlessly incorporate images and video in a blog-style format. As it’s made with video in mind, it even has video-focused features, including ‘watch later’ and ‘create a playlist’ options:
The technical aspects of WordPress – including responsive videos – may seem mysterious to beginner users. That’s why WP Engine provides customers with technical support that helps you get the most from your WordPress experience. If you’re ready to learn more about WordPress and all it has to offer, take a look at our plans!