Collection

Collection template on Primavera Distinction

Primavera's default collection template is composed of two sections:

Collection header

Collection header is used on the collection pages to output a section header for a collection.

This section will display the collection name, the item count (if text accents are enabled globally) and the collection image as an optional banner image.

Collection header settings

  • Background: Choose between color scheme or image to display a background image in this section. By default, this will use the collection’s image, but you can override it to use a static image, or an image from a metafield.

  • Minimum header height: Choose between 5 different heights, adapt to media, small, medium, large and fit screen to achieve your desired look and feel.

  • Description: You have the option to choose to display the collection description as set in the admin, or no description at all.

  • Desktop header layout: You can choose between a left-aligned or centered header layout.

  • Show submenu: To show an optional submenu, create a menu with the same name (i.e. handle) as the collection and enable this checkbox. This can help group related collections in a store with many diferent collections. Submenus are matched up to a collection based on their handles. For example, to add a submenu to a Shop All collection, with handle shop-all, create a menu called "Shop All" so it also has the shop-all handle.

Collection grid

The collection grid is the main body of the collection template, comprising the products themselves and filtering/sorting when enabled.

  • Layout:

    • Maximum products to show: Number of products per page. To maintain a balanced layout, consider the number of columns chosen for both desktop and mobile views.

    • Desktop columns

    • Mobile columns

    • Enable infinite scroll: When enabled, a "Load more" button appears below the maximum products per page, inviting users to reveal more products.

    • Empty collection link: When there are no products in a collection, a Continue shopping button can be displayed.

  • Sorting and filtering:

    • Enable sorting

    • Enable filtering

    • Filter layout: Choose between modal (default) and sidebar Available in version 1.1.0 and later

    • Enable sticky filters: When enabled, collection filters will remain visible as users scroll. To improve the user experience, this disables the sticky header.

    • Enable max height on filters: Limits the height of each filter to make scrollable windows, useful if your store has many filters.

    • Open filters by default: Choose whether filter collapsibles should be open or closed on page load Available in version 1.1.0 and later

    • Active filter style: When sidebar layout is selected, choose the style of the active filters Available in version 1.1.0 and later

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

Last updated

Was this helpful?