To add a background video to your website, follow these essential steps:

General Requirements:

• Use videos under 40 seconds for optimal loading
• Ensure 1080p resolution with 3 Mbps minimum bitrate
• Aim for 60 fps frame rate
• Use landscape aspect ratio (16:9)
• Limit to 2 background videos per page

Video Source Options:

1. Upload directly (Version 7.1)

   • 60-second maximum length
   • Must meet video upload requirements

2. YouTube

   • Set video as [Unlisted] or [Public]
   • Enable embedding
   • Disable overlay ads

3. Vimeo

   • Requires paid Vimeo plan
   • Set to [Public] or [Hide from Vimeo]
   • Allow embedding for your domain

Adding the Video:

For Section Background:

1. Open Page panel
2. Click Edit
3. Select section's pencil icon
4. Choose Background > Video
5. Click + icon to add video
6. Customize settings
7. Save changes

For Page Banner:

1. Open Page Panel
2. Select page title
3. Click Media tab
4. Select Video tab
5. Paste video URL

Optimization Tips:

• Add mobile alternative image
• Apply filters for style enhancement
• Adjust playback speed if needed
• Minimize motion in shots
• Center subjects to avoid cropping
• Use contrasting font colors for overlay text

Mobile Considerations:

• Videos may not display on mobile devices
• Set mobile alternative image as backup
• Background color displays if no alternative image is set
• Loading times vary by connection speed

Note: Background videos won't display in low power mode or energy-saving mode on devices.

To delete or disable:

1. Access section settings
2. Switch to image background or remove
3. Save changes

This implementation enhances visual appeal while maintaining site performance and user experience.

Related Articles

Previous Articles