5 Things to Know About Video Headers Introduced in WordPress 4.7

Announced in WordPress 4.7, the new video header feature caught a lot of attention from WordPress designers and developers.

And with support for video headers in the new Twenty Seventeen theme, people were able to see exactly how it looked.

My digital marketing friends were thrilled with the new feature. But they discovered a few hiccups along the way when they tried to add a video header to their WordPress sites.

One of the most frequently asked questions was: how come my theme isn’t supporting video headers?

I explained that since support only came out in WordPress 4.7, not all themes have been updated to support video headers.

After answering several more questions in the past month, I thought other WordPress users would find the information about video headers helpful.

5 Things to Know About WordPress 4.7 Video Headers

1. Host your video on YouTube.
   Unless your web hosting has the storage space and bandwidth to support video downloading, you’ll want to host the video on YouTube.

   Typically due to bandwidth restrictions, web hosting is not set up to support hosting large video files.

   If for some reason, you choose to host the video on your site, make sure the video is in mp4 or mov format.

   Keep the video file size small so your page will display quickly. According to Make WordPress Core video headers in 4.7, video file size is capped at 8MB.

   Note: by default, WordPress 4.7 supports YouTube videos and locally hosted mp4/mov files. Support for more video sources can be added, but you’ll need to add code to create custom video handlers.

2. Use the video size recommended by the theme.
   A smaller size can still work, but the video won’t look its best. For best display, use the video size recommended by the theme.

   For example, the Twenty Seventeen theme recommends the video size is 2000px wide by 1200px tall.

3. Video only displays on the front page (for certain displays).
   By default, the video header only loads on the front page for displays that are at least 900 pixels wide and 500 pixels tall.

   On smaller displays, the fallback image will display on the front page. (My smartphone and tablet thank the WordPress 4.7 developers for keeping bandwidth in mind!)

   A prominent play/pause button is automatically added for anyone who wants to stop the video from playing.

4. Button for pausing/playing the video can be styled.
   No styling is applied to the play/pause button, but the button and button text can be easily customized.
5. Audio for the video is disabled.
   By default audio is disabled.

   Thank goodness! One of my biggest gripes about websites and web applications is when audio starts automatically.

Summary

By knowing these things, you’ll have a better understanding of how the video header works on your WordPress 4.7 site.

Keep in mind that one of the most important things to know is that your theme has to be updated to support video headers.

Have you added a video header to your site? Share your experience in the comments.