Theme documentation

2339 views 😃1

Hero banner module


This is the main hero banner for your store. The hero banner module allows you to display big bold introduction images, carousel or even video to welcome your customers.

There are 2 types of layout for the hero banner: Boxed and full width. Both options allow you to use simple images, video or carousel.


Full width

You can pick if you want to display a carousel pagination (if you have more than 1 slide), and set the autoplay feature as well as its speed. If you have more than 1 slide, you can display your slides in mutliple columns, up to 3 columns.

1 column

Hero image size: 3020px x 1344px

2 columns

Hero images size: 1680px x 1444px

3 columns

Hero images size: 994px x 1344px

Hero banner slides

You can add up to 3 carousel slides and each slide has its own set of options you can customize. If you only want to display a single image or a video, only fill out and activate the first slide.

You can only have one video video background in the carousel for performance and usability reasons. This is why only the first slide has the option to add one. It is recommended you only use a single slide when using a video background.

To include a video background, go to backoffice > tools > files and upload the .MP4 video you wish to use. The sound will be automatically turned off and the video will automatically loop for a better user experience. It is recommended you upload a short and small video with a resolution of 720p or 1080p. The smaller file size the better.

There are multiple text place options. Pick the one that fits your image the best. You can also add a title, subtitle, button and a URL to link this page to.

The text color option is important here. Pick the one that has the most contrast with the background image. We want to make sure the text is readable at all times.

Was this helpful?