Skip to main content

Video Background in Stack

Enhance your website's visual appeal with Stack's new "Video Background" feature. This exciting addition allows you to add dynamic video backgrounds to sections, rows, and columns within your web pages and funnels. By supporting HTML5 standard video formats such as MP4 and WebM, this feature ensures compatibility across a wide range of browsers and devices.

Table of Contents

Adding a Video Background

To incorporate a video background into a section:

  1. Select the desired section on your page.
  2. In the settings panel on the right, change the BG media type to Video.
  3. Choose a video from your media library.
  4. Click the Preview icon to see how it looks in your browser.

Video Display Options

You have three options to control how your video background is displayed:

  • Fit: The video scales to fit within the designated area, maintaining its aspect ratio. This option may result in letterboxing if the aspect ratios don't match, but ensures the entire video is visible.

  • Fill: The video fills the entire area, which may involve cropping or stretching. This option ensures full coverage but can alter the video's aspect ratio.

  • Cover: The video covers the entire area while maintaining its aspect ratio, avoiding distortion. Some empty space might appear if aspect ratios differ, but the video remains undistorted.

Background Opacity Settings

Adjust the transparency of your video background with these options:

  • None: The background is fully opaque, blocking any content behind it.

  • Light Fade: Introduces subtle transparency, allowing some content behind to show through while keeping the background visible.

  • Half Fade: Sets the background to 50% opacity, balancing visibility between the background and the content behind it.

  • Heavy Fade: The background is almost transparent, prioritizing the visibility of content behind it.

Video Looping

Control the playback of your video background with the loop setting:

  • Loop On: The video plays continuously, restarting automatically when it ends for a seamless viewing experience.

  • Loop Off: The video plays once and stops, ideal for non-repeating content or brief introductions.

Experiment with these settings to create captivating and engaging web pages that resonate with your audience.