Highlight products with a product slider

A product slider lets you highlight selected products in your shop, such as new products, top sellers, or products on sale. In the Editor, the product slider is available as a content element that you can add to a page.

How to add a product slider

1. In the sidebar of the administration, navigate to Editor.
   The Editor opens.
2. Navigate to Pages.
3. Select the page to edit or add a new page.
   A preview of the page opens on the right-hand side.
4. Navigate to Content elements → Products.
5. Drag and drop the content element Product slider to the desired position.
   You can only drop content elements into the blue areas of the page.
6. Select Add products
   The view Add products to product slider appears.
7. In the Search and assign field, assign the products you want to highlight.
   Select the field to display a list of assignable products, or search by name or product number. You cannot assign product drafts.
   
   You can assign up to twelve products.
8. On the tab, adjust the size of the product images. Also see the section below.
9. Select Save.

You have added a product slider with the assigned products to the page.

How to adjust the product image size

Once you've added a product slider to a page, you can change the look of this product slider and define how many products should be displayed.

1. Hover over the product slider and select .
   The Edit product slider view appears.
2. Open the tab.
3. Select the product image size. You can choose from three options: S (Small), M (Medium), and L (Large).
   • S displays smaller images, allowing more products to appear at the same time.
   • L displays larger images, allowing fewer products to appear at the same time.
   • The preview in the background updates immediately to show the selected image size.
4. Select Save.

You have adjusted the size of the product images in the product slider.

Info

Depending on the device your visitors are using (e.g. smartphone or laptop), the number of images displayed at the same time may vary slightly. This allows a responsive design of your shop and ensures that the different product images look nice on the different devices and screen sizes.

How to add a text to highlight your product selection

Select the text area ("Type here") in the content element and use the text formatting options to create a teaser text that matches the selected products.

How to remove a product from the product slider

1. Hover over the product slider and select .
   The Edit product slider view appears.
2. Select at the right end of the assigned product to remove it.
3. Select Save.

You have removed the product from the product slider.