Published on Apr 29, 2019

Video Background for Homepage Hero in Oxygen

This members-only tutorial provides the steps to use Video Headers feature introduced in WordPress 4.7 to display a YouTube video (works with self-hosted mp4 videos as well) whose URL can be set in the Customizer as a background for a Section in Oxygen.

Live Demo

Note

Video Headers feature in WordPress has been designed to be used on site's homepage although filters are available to change this behaviour.

If you need YouTube backgrounds on inner pages, you'd need to look into those filters or use Video Background Pro plugin.

Step 1

Let's enable support for custom header image or video and set the minimum viewport width to show the header video to 1025px (default is 900px).

Install and activate Code Snippets plugin.

Go to Snippets > Add New.

Title: Video Header

Code:

This is a premium members-only content.

To view the rest of the content, please sign up for membership ($47/month or $599 one-time).

Already a member? Log in below or here.