How to Add an Autoplay Video to a Page Banner

How to Add an Autoplay Video to a Page Banner

You can enhance your website's homepage by adding an auto-playing video to the banner slider. This feature is ideal for short, engaging clips that play on a continuous loop.

Important Considerations Before You Begin

  • Performance Impact: Autoplaying video can increase your website's load time, which may affect the user experience and search engine ranking. We recommend using this feature only with short, optimized video files.

  • User Experience: Autoplay is best for ambient, silent-looping videos. For longer content with audio, consider the lightbox option to avoid disrupting users.


Step-by-Step Instructions

Follow these steps to enable autoplay for a video in your homepage banner.

  1. Log in to your Vacation Labs admin dashboard.

  2. Navigate to the Website section from the main menu.

  3. Within the Website section, click on Pages.

  4. On the Pages and templates screen, locate and select the page where you want to add the video (e.g., HomepageAbout UsContact Us). This will open the page editor.



  5. In the editor, find and click on the section labeled Banner Slides. This is where you manage all content appearing in your pages banner.

  6. Inside the Banner Slide settings, look for a button called Additional Options. Click on it to reveal more configuration choices.

  7. Among the additional options, configure your video settings:

    1. Add a YouTube Video Link: In the designated field labeled "YouTube Video URL", paste the full URL of the YouTube video you want to play on the homepage.

    2. Choose a Playback Mode: You will find radio buttons to select how the video behaves.

      • To enable autoplay: Select the option labeled Autoplay video in banner, on repeat. This is recommended for short videos intended to play in a continuous loop without user interaction.

      • To disable autoplay: Select the option labeled Play Video in a light-box, when the play button is clicked. This user-triggered mode is better for longer videos and will not autoplay, preserving your site's performance.

  8. After configuring your settings, click Done to close the Additional Options panel.

  9. To apply all your changes to the live website, you must click the Save button at the top or bottom of the page editor.

Idea
Pro Tip: We recommend using a short, dedicated video rather than a long livestream or recording. A shorter, faster-loading video provides a better user experience. Choosing the lightbox option is a good compromise for showcasing longer content without impacting initial page load.




    • Related Articles

    • How to add a new section on a page?

      Sections are the fundamental building blocks of your pages. Use them to add pre-designed content blocks like feature lists, testimonial cards, or product collections to customize your page's layout and content. Steps to Add a New Section Navigate to ...
    • Add a script/code to trigger on a specifc page

      The Advanced Settings of the website allow you to add a script/code that can be triggered on a specific page. For example a tracking script that must be triggered on any one tour page because its being promoted or you are running ads for it. You can ...
    • Add or change photos on a tour

      Overview While you can upload any number of images, we recommend limiting each product to 8–10 photos for the best user experience. One image must be selected as the banner image, so make sure it meets the minimum dimension requirements. To learn ...
    • How to add tours in tour cards carousel?

      To add tours in Tour card follow the below steps, Login into Vacation Labs Click on Website Click on Pages Select the page on which the tours need to be added in Tour Card Carousel Click on Tour Card Click on Search box Select the tours from Drop ...
    • How to add Collections in collection cards carousel?

      To add collections in Collection card carousel follow the below steps, Login into Vacation Labs Click on Website Click on Pages Select the page on which the collection need to be added in Collection Card Carousel Click on Collection Card Click on ...