Combine > Collection page & product grids

One of the most important part of any store is the product grid, which appears in a lot of contexts and is basically the first interaction that your visitors have with your products. This is why we've made the product grids in this theme not only highly versatile, but also customizable based on their location. So even if the design (colors, image apsect ratios, etc.) is the same throughout the theme, the layout and content inside each grid can be different, which allows you to create the perfect store!

To make this work, we've configured the product grids with blocks, as you can see in the graphic below: 

While some blocks are working by default, others need to be configured in order for the proper information to show up.

  • Dynamic text - needs a text metafield connected to it

  • Rating - appears when products have rating set by a reviews app
  • Icons list - displays when the proper product metafields are connected with the theme settings and the product has information in them
  • Quick buy - displays a list of variants and an "add to cart" button, which allows your visitors to purchase products directly from the collections page
You can watch a tutorial about custom badges and icons in our Local tutorial:  https://www.youtube.com/watch?v=UyUYe_RQKnk&t=343s

Collection page

When editing the collection page template you will notice that by default there are two sections.

Collection banner

Used to display the featured image of a collection over the title area.

Product grid

Going next, you have the options to edit your product grid, choosing how much products you want on the page and if and how you want to do filtering / sorting.

To configure the filters on your store you will need to install Shopify Search & Discovery app.

Collection description

Not added by default, but available as a section inside the page template, this can be used to show the collection's description in another place, for example after the product grid (if your collection has lots of text and you don't want it in the top banner).

Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.