This article will show you how to create a video banner, with the option to upload a video from your computer.
Who can use this feature?
- This module may incur an additional cost, please contact your Customer Success Manager for more information. If you do not have Design Center, you can also create a video banner through the Layout tab on a page.
Guidelines/Recommendations for Video Banners
- Videos should be kept as small as possible to not slow the site down
- Videos are limited to no more than 10 MB
- Utilize compression as effectively as possible prior to uploading (we recommend using a program such as Clipchamp or HandBrake)
- The length of the video should be 12-30 seconds
- Videos will be set to Autoplay and will be muted by default; we recommend keeping it this way
- Files should be mp4 and will play using HTML5 which is supported by most browsers
- Mobile devices and older browsers will display a static Poster Image instead of a video
- If any text is placed on top of the video, make sure it is high contrast so that it is accessible for visually impaired users
- Navigate to Modules > Site Tools > Design Center
- Select Theme Manager
- Select Actions in the top-right corner
- Select Copy Theme
- Select a Theme
- Create a Theme Name
- Click Save As Copy
- Click on the banner you wish to turn into a video banner
- Navigate to the Options tab
- Change the Mode to Video
- Change the Video Source to Uploaded
- Check the Mute Sound button if you do not want the video to play sound
- Navigate to the Video tab
- Click Upload Video
- Find and Open a video file from your computer
- Click Choose Image if you wish to display a different image than the first frame
- Note: If a browser or device does not support video play or your video file, the Poster Image will display in place of the video.
- Click X
- Click Save Changes
Feedback About the ArticleLet us know what was helpful or not helpful about the article below.
I've been told that this is out dated - size, and where the videos are hosted is not clear.
Please sign in to leave a comment.