Promotional collection – User Guides

A magazine layout showcasing a large collection image alongside a dynamic carousel of products.

What is the promotional collection section?

The Promotional collection section is a powerful feature designed to highlight a collection. This section allows you to showcase a large image with a product label link alongside a dynamic carousel of products, enabling customers to engage with your store in an eye-catching way.

The design of the promotional collection section mirrors the magazine layout style on the Boost collection list page. Create an attractive promotional display that not only enhances the visual appeal of the store but could also drives sales by directing customers to a specific collection or product.

How to set up the promotional collection section

Steps

Open the Theme Editor and add the Promotional collection section to the page.
In the Collection settings click on Select Collection and choose from one of the collections listed.
Choose color tones that suit your collection for the area containing the product card carousel, setting the Text color and Background color or gradient.
Click on Select image to choose an image to show next to the product card carousel.
This could be the collection image, a lifestyle image or an image showing a specific product which can then be highlighted with a product label link.
Select the layout style by selecting either Image left or Image right in the Layout settings. This setting determines the position of the collection image in relation to the product card carousel. If using multiple promotional collection sections in sequence then alternating the image position can create a more interesting design.
- Image left: The collection image will appear on the left side, with the carousel of products to the right.
- Image right: The collection image will be on the right, allowing the carousel to appear on the left.
Choose the colors for the Text overlay. This displays the collection name and a button or link to the chosen collection. Use the setting Background opacity and Desktop vertical position to adjust the layout on larger screens where the text overlay sits over the image. On mobile the text overlay will be shown underneath the image with a slight overlap.
To emphasize and link to a specific product add an Image product label. Select a product and choose the Background color and Text color. This label will link directly to the quickbuy or product page. Refer to Product label links for more information. Use the Horizontal Position and Vertical Position sliders to adjust the placement of the label on the image.
Click Save.

Tip

Experiment with the position and color settings to ensure the Image product label and Text overlay are prominently displayed without obscuring important details of the image. We recommend previewing changes on different screen sizes and mobile devices as the Promotional collection section layout differs on mobile.

FAQs

How do I change the product card image shape?

To see the full list of settings controlling the product card, navigate to Theme settings and open the Products tab. It's possible to control the product card Image shape and Image alignment, plus the display of product ratings and labels.

Can't find what you're looking for?

Our support staff are here to answer your queries, so don't hesitate to write to us!