Skip to main content

Featured collections

With the Featured collections section (found under the preset 'Featured collections'), you present your most important categories in a dynamic, swipeable carousel (slider). This is a playful and space-saving way to let visitors navigate through your offerings, in contrast to the fixed layout of the Collection Grid.

Note: You adjust the visual layout of the individual collection cards themselves (such as the image ratio) in the general theme settings under 'Collection & Brand Cards'.

General Layout & Background​

Give your collection slider the perfect look that matches the rest of the page:

  • Color scheme: Choose the desired color scheme for the texts and background of this section.
  • Section display (Type): Determine whether the background spans the full width of the screen (Full width / Edge-to-edge) or is centered within a neat frame (Box / Container).
  • Background image: You can make the section stand out extra by setting a background image (with the option for a separate image on desktop and mobile).
  • Height & Background height: Choose whether the section automatically grows with the collection cards (Auto) or work with a fixed height (Fixed). Are you using a fixed height? Then you can use a slider (0-100%) to determine how far the background color or image extends behind the slider.

Spacing (Whitespace)​

Ensure the section connects seamlessly to the elements above and below it:

  • Margin (Outer space): Manage the distance directly outside the section at the top and bottom.
  • Padding (Inner space): Manage the distance inside the section, between the text and the edge of the frame, for the top and bottom. You can choose the default spacing or completely remove the space (None) for each of these settings.

Selecting Collections​

  • Collection list: Click here to select the collections you want to show in the slider. You can add up to 20 collections and easily adjust the order afterwards by dragging them.

Slider Settings​

Determine how visitors browse through your collections:

  • Number of slides (Slides per view): Choose how many collection cards are in view at the same time.
    • Desktop: Choose from 3 to 8 cards, or let the theme determine this automatically ('auto').
    • Tablet & Mobile: Use whole or 'half' numbers here (such as 1.5 or 2.5). A cut-off card on the side of the screen is the best visual hint for mobile users that they can swipe.
  • Display options: - Pagination: Show navigation dots (bullets) below the slider.
    • Playful staggering (Alternate offset): Check this to place the cards alternately slightly higher or lower for a creative, playful effect.
    • Carousel overflow: Determine whether the slider can extend outside the container frame up to the edge of the screen.

Text & Buttons​

Introduce your collections with strong texts and call-to-actions:

  • Alignment: Choose whether the text should be aligned to the left, center, or right above the slider.
  • Title & Content: Add an eye-catching heading (e.g., "Discover our collections") and write a short, introductory text. You have full control over the HTML tag (for SEO), the visual size, and the font weight of the title.
  • Action buttons (Buttons): Add up to two buttons below the introductory text (e.g., "Shop All").
    • Give the button a text (label) and link the correct URL.
    • Check Secondary button style (Outline button) for a transparent button with a colored outline.
    • Optionally choose a FontAwesome icon (such as a right arrow).
    • Tip: Don't want to show any buttons? Then simply leave the text fields (labels) empty.