For the complete documentation index, see llms.txt. This page is also available as Markdown.

Collection page

Customize Volume collection pages: combine collection banners with product grids, add subcollections via metafields, and create dynamic category navigation.

In the Volume theme, the Collection banner is a standalone section, separate from the product grid. This separation allows for greater flexibility when customizing the appearance of your collection pages.

You can combine the Collection banner with the Product grid in several ways, depending on your layout preferences and content strategy. Here are a few example configurations:

Collection banner + Product grid

Subcollection banners + Product grid

Collection banner vertical + Product grid

Product grid only

Collection banner with subcollections + Product grid

Adding related or subcollections to large collections helps users narrow down their search and discover more relevant products faster. This approach improves product discovery and overall user experience, especially when a parent collection contains a wide variety of items. Instead of forcing users to scroll through dozens of products, you can guide them toward more specific categories that match their intent.

Subcollections are displayed as a horizontal slider and can be added in two ways:

  • As part of the Collection banner section

  • As a standalone Subcollection banners section (if you prefer not to display a collection image)

To make this setup dynamic—so that each collection displays its own relevant subcollections—you’ll need to create and connect a metafield.

1

Step 1: Create a metafield for collections

  1. Go to SettingsMetafields and metaobjectsCollections

  2. Click Add definition and fill in the fields:

  • Name: Subcollections

  • Namespace and key: custom.subcollections

  • Type: Collection

  • Enable List of collections

  1. Click Save

2

Step 2: Bulk assign subcollections

  1. Go to ProductsCollections

  2. Select all collections and click Bulk edit

  3. Open Columns, add Metafields → Subcollections, and hide any unnecessary fields

  4. Assign subcollections to each collection as needed

3

Step 3: Connect dynamic sources

  1. Open the Collection banner or Subcollection banners section in the theme editor

  2. Click the dynamic source icon next to the Collections field

  3. Choose Template → Collection → Subcollections

  4. Save your changes

Last updated

Was this helpful?