How do I add a Video Banner Template?
What You’ll Learn
You’ll learn how to add a Video Banner template to your page, including uploading a video, setting a thumbnail, and configuring display options.
Why It Matters
Video banners grab attention and convey key messages dynamically. By adding a Video Banner template, you can showcase featured content—like promotional videos or hero clips—while ensuring optimal performance across devices.
Step-by-Step Instructions
1. Check Video Banner Availability
- If your website does not yet include a Video Banner feature, reach out to your Project Coordinator to request a quote for adding it.
2. Add a Video Banner Template
1. In the Morweb editor, drag and drop a Subtemplate block onto your page canvas.
2. In the sidebar, scroll down and select the Video Banner category on the left, then choose the specific video banner template you want to use.
3. Click the Video File field:
- Upload a new .mp4 file or select one from your gallery.
- For best compatibility and performance, use an .mp4 file under 10 MB.
- Adjust the banner size and toggle Disable on Mobile if you want to hide the video on phones to reduce data usage.
Click the Video Thumbnail field:
- Upload an image to serve as the fallback thumbnail if the video does not auto-play.
- Enter descriptive Alt Text for accessibility and SEO.
In the content area, add your:
- Title for the banner heading.
- Caption or subtitle text below the title.
- Description for additional details.
- Choose which Buttons to display and set each button’s link URL.
- Click the green checkmark in the bottom right to save your Video Banner template.
Troubleshooting Tips
- Video Won’t Upload or Loads Slowly
Ensure your video is in .mp4 format and under 10 MB. If it’s larger, compress it using a video tool or reduce resolution.
- Thumbnail Image Not Displaying
Check that you uploaded the thumbnail to the Video Thumbnail field and added alt text. If the image is too large, resize to under 1 MB.
- Banner Displays Incorrect Size
Adjust the banner’s height settings in the template options. If it’s still off, verify your page’s container width isn’t constraining it.
- Video Plays on Mobile When Disabled
Toggle Disable on Mobile again and save. If caching prevents the change, clear your browser cache or view in an incognito window.
- Content Isn’t Visible Over the Video
Ensure text and button colors contrast with the video. In some templates, you can adjust overlay opacity or text size in the sidebar settings.