Featured collection

Featured collection allows you to highlight products from an already existing collection or a custom list of products.

Featured collection the Savoir demo store

Quick start

• Select a collection or specific products

• Optionally, adjust the layout

• The spacing between items is determined in your global grid settings

Tip: While static product lists are a great way to feature specific products, you may want to consider using an established collection for highlighting promoted products or integration with a third-party app for easier management.

Settings

• Collection:

  • Collection: Select an existing collection

  • Products: If you want to hand-pick products instead, leave the collection field empty and select products here

• Layout:

  • Desktop/mobile columns: You can choose the number of columns for desktop and mobile

  • Layout (desktop): This controls the display of excess items that do not fit the grid columns. You can choose between the slideshow or grid layout.

  • Container type: allows you to select full to create full-bleed layouts, padded to apply the global horizontal gap setting to a full bleed section, or max to constrain the blog posts to the maximum container size.

  • Maximum products to show: Choose how many products should display (between 1 and 25)

• Slideshow settings apply to both mobile and desktop when layout (desktop) is set to slideshow:

  • Arrow position: Choose between overlay (arrows appear over the blog posts) or below

  • Counter style: Choose between hidden, counter or progress bar

  • Button style: Choose a button style for when the arrow position is set to overlay (arrows will have a simple text style if they're positioned below)

Can't find the setting you're looking for? The following settings are explained in detail in common settings:

• Color scheme/color scheme transition

• Padding

• Borders

Blocks

This section also comes with pre-loaded with two types of blocks should you wish to add a header above the blog posts or buttons below them:

• Section header

• Buttons (hidden by default, fill in the settings to display)

Examples & Inspiration

Primavera preset

Composition preset

Gaia preset

Gloss preset