Highlight products with a product slider

With a product slider, you can highlight specific products on your website, for example new products, top sellers, or on sale products.

This element is based on previously created products and links to their product pages. For further information on products and product pages, refer to Add and set up products.

Topic overview:

• How to add a product slider
• How to adjust the product image size
• How to remove a product from the product slider

How to add a product slider

1. In the sidebar of your cockpit, 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.

   Note

   You can assign up to twelve products to the product slider.
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 website and ensures that the different product images look nice on the different devices and screen sizes.

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 next to a assigned product.
3. Select Save.

You have removed the product from the product slider.