Video Behind 2 Div Elements – Site Header & Front Page 1 Widget In Agent Focused Pro

This tutorial enables you to replace the front page image with a video via the customizer in the Agent Focused Pro child theme for Genesis.

Your video will display behind both the site header and after header front page one widget area. Works with self hosted videos added to your WordPress media library.

Demo Video

Shows the video added via the new customizer setting replacing the front page image in the Agent Focused Pro child theme for Genesis.

Tested using the Agent Focused Pro child theme. May work in other Genesis child themes where the front page 1 widget is hooked using the genesis_after_header hook.

Installation Steps

There’s 3 steps :

1. # Upload the front-page.php file to the Agent Focused Pro theme folder replacing the default front-page.php file.

 


2. # Upload the customize.php file to the lib folder replacing the default customize.php file.

 


3. # Copy & paste the CSS from the style-front.css file to the end of the style-front.css file and clear caching.

 

You can then upload your video file using the customize > front page video upload setting.

Download Folder