Skip to main content
Section: Featured collection

Everything you will need to know on how to setup your featured products section

Jalal avatar
Written by Jalal
Updated over 2 years ago

The Featured collection section makes it possible for you to add a section with your featured products.

To activate this section you first have to add the section to your page. This can be done in a few small steps.

1) Click on 'add section' which can be found in your left sidebar

2) Scroll down, or search for 'Featured collection', then click on 'Featured collection'.

3) Done, your Featured collection section is added.

General settings

The general settings contains the settings for the styling, layout and the products of the 'Featured products' section.
Simply click on the 'section' to open the settings.

On the right sidebar, the following settings will show



Collection:
Select the collection you want to show, in this example we've used the 'Home page' collection.

Maximum products to show:
If you've selected a collection as your featured products, how many products of this collection do you want to show? (Can be set between 2 and 6)

Products per row:
How many products do you want to show in the row? If you have more products in your list than shown in the row, it will automaticly become a slider.
Example below: The list includes 5 products, but the amount of the row is set on 3.

Heading position:
Configure the position of the heading text. You can choose between left and center.

Heading size:
Select the size of the heading from a range of small to extra large. When you choose for "Extra large", the size of the description will also be a bit larger than normal. The heading size you choose here is only applied to desktop view, you can customize the mobile heading size globally in the general theme settings under "Typography".

Heading:
Fill in the title of the section. Don't want to show a title? Simply leave the field empty!

Text:
Fill in the subtitle for the section. Don't want to show a title? Simply leave the field empty!

Button label:
This text will show on the button, for example: 'All products'

Button color scheme:
Select the color scheme for the button.

Show link instead of button:
Check this box if you don't want a button to show, but only a clickable text.


Quick shop

Show on desktop:
Enable this if you want the add to cart button to show on your product card on desktop.

Show on mobile:

Enable this if you want the add to cart button to show on your product card on mobile.

Show amount selector:
Enable this if you want to show an amount selector next to the buy button.

Enable compact button:
This will show a shopping cart icon instead of a button with text on desktop.

Enable quick shop drawer:
If you want to enable the quick shop drawer (slide-out of a mini productpage) enable this option.

Spacing

Bottom spacing desktop/mobile:

Set the spacing on the bottom for desktop and mobile.

That way you will get the amount of whitespace below the element you want. The default for desktop is 50px and the default for mobile is 30px.

Did this answer your question?