Collection page

Estimated reading: 2 minutes

Discover the features and customization options of the collection page, including its flexible sections and design possibilities.

The collection page is an important element of almost any eCommerce website. It allows to group and display related products in a structured, easy-to-navigate format.

Product grid

With Flux, you can display the product grid in two, three, or four columns. Additionally, you can allow customers to switch between grid layouts themselves (depending on the filter type) by enabling the ‘Switcher’ feature.

There are three filter types: Horizontal, Sticky sidebar, and Drawer.

Horizontal filter

With the horizontal filter, you can enable the ‘Switcher’ option.

Sticky sidebar filter

The ‘Switcher’ option is not available with the sticky sidebar enabled.

Drawer filter

Similar to the horizontal filter with the drawer option, the ‘Switcher’ is also available.

Various styling options

In addition to filter and layout options, there are various settings for product cards, colors, and mobile layout styling.

Main collections banner

In addition to the product grid section on the collection page, there are two more collection-specific sections: “Main Collections Banner” and “Subcollections.

To learn more about subcollections, refer to the “Subollections on collection pages” guide.

The “Main Collections Banner” section is straightforward. The image and title of the collection are automatically pulled from the collection settings in Products > Collections in your Shopify dashboard.

You can choose from three different banner styles, customize the banner height, and adjust colors. If needed, you can enable the Dynamic Description option to display the collection description set in Products > Collections along with breadcrumbs for navigation.

All products collection

For every collection you create in Shopify, you can set a featured image. However, the ‘All Collections’ page, which displays all products, does not offer a way to set an image by default.

With Flux, you can add an image to this page and customize the heading to replace the default ‘All Products.’ Additionally, this image will serve as a fallback for any collections that don’t have a featured image set.

Share this Doc

Collection page

Or copy link