Chord Template - Collection


Collection pages display your products in a grid, along with additional controls for sorting, filtering, and more.


Customize header


  1. From your Shopify admin, go to Online Store > Themes.
  2. Find chord theme that you want to edit, and then click Customize.
  3. You need to open up any product, from inside the theme editor area, or select the collection page from the dropdown at the top.
Note:All settings here will be applied to all collections, not just the one you are on. If you are looking to have different sections on different collections.

Section settings

By default, collection pages have a Collection header section, and a Collection products section.

Collection header section

Setting Description
Section width Set the width of the section using the drop-down menu:
  • Full width
  • Full width no gap
Section height Set the height of the section using the drop-down menu:
  • Fit Content
  • Small
  • Medium
  • Large
Background image Leave it blank to use collection's featured image.
Edit alt text Click to set image alt text for search engine optimization and to describe the image for customers using screen readers.
Background color Visible when the Background image setting is blank and the collection's featured image is blank.

Collection products section

Setting Description
Section width Set the width of the section using the drop-down menu:
  • Grid
  • Full width


The Collection products section contains the following 4 blocks:

  • Product grid block
  • Aside block
  • Text banner block

Product grid block

Setting Description
Enable filtering Lets customers filter the products in the collection based on the filters in your Navigation settings.
Enable sorting Allows customers to sort search results.
Number of filters on desktop The number of filters that you want to display on desktop computers. Minimum is 0, maximum is 24.
Products per page The number of products that you want to display on each page. Can be any multiple of 4, from 8 to 48. Defaults to 16.
Number of columns on desktop Use the range scale to select the number of columns that appear on desktop computers. Minimum is 2, maximum is 6.
Number of columns on mobile Set a specific column layout for mobile devices. Choose between 1 and 2 columns.
Show product info Displays the product info for each product.
Show product rating Displays the average product rating in stars with the number of reviews in parenthesis, for example: ★★★★★ (8). Also requires a product review app such as Shopify Product Reviews , and metafield definitions for reviews.rating_count and reviews.rating.
Show vendor Displays the vendor for each product.
Show swatch Displays the swatch for each product.

Aside block

Setting Description
Quick links The menu to use as your quick links menu. Click Change to select a different menu.This menu won't show dropdown items

Text banner block

Setting Description
Heading The title for the block.
Heading size Set the size of heading using the drop-down menu:
  • Small
  • Medium
  • Large
Content The content for the block.
Heading color The text color for the heading.
Content color The text color for the content.
Background color The background color for the block.

Recently viewed