Skip to main content

Using Video Backgrounds in the Funnel & Website Builder

Charie

Introduction

In the ever-evolving digital landscape, standing out is more important than ever. One way to create visually appealing and engaging web pages is to use video backgrounds. In the Funnel & Website Builder of Enrollio, integrating video backgrounds is a straightforward process. This article will guide you through the steps to effectively use video backgrounds for a dynamic and compelling user experience.

 

Prerequisites

  1. A working knowledge of Enrollio's Funnel & Website Builder

  2. Access to video files that you wish to use as backgrounds

  3. Background Videos Only Support HTML5 Standard Video Formats (MP4 and WebM) and its only available to the new builder. Video background will be available for section, row, or column within the builder.

 

Why Use Video Backgrounds?

Using video backgrounds can:

  1. Capture attention immediately

  2. Convey your message in a visually stimulating manner

  3. Add depth to your webpage design


How to Add a Video Background

Step 1: Choose Your Video File

The first thing you need to do is choose a video file that complements the content of your website or funnel. Make sure that the video is in a compatible format, such as MP4 and WebM.

 

Step 2: Access the Funnel & Website Builder

Log in to your Enrollio account. Head over to Sites.

Navigate to the Funnel or Website Builder section.

 

 


Step 3: Select the Element

Open the webpage where you want to add the video background.

Select the element (like sections, rows, or columns ) where you wish to place the video background.

 

 

Step 4: Add the Video

On the right-hand panel, you’ll find an option for BG Meda Types.

Select 'Video' from the available background types.

Upload your chosen video file or insert the URL if the video is hosted externally.

 

 

Step 5: Save and Preview

Once the video has been uploaded, don't forget to save your changes and preview the webpage to ensure that everything looks as expected.

 

Best Practices

  1. Use videos that are short and loop well.

  2. Make sure the video complements the text and other elements on the page.

  3. Always have a fallback image for scenarios where the video cannot be played.

  4. Ensure that the video is optimized for mobile views.

 

Troubleshooting

  1. Video Not Playing: Make sure the video is in a compatible format and that the URL is correct if hosted externally.

  2. Slow Loading: Large video files can affect the loading time. Try to optimize the video size without compromising the quality.

  3. Mobile Issues: Some mobile browsers disable autoplay. It’s good to have a fallback image in such cases.