Collections and search

Views

A collection page shows its products in one of three views:

• Table. A header row names each column: SKU, specification columns, pack, stock, price and quantity. Use it for most trade catalogs.
• List. One row for each product, with the same data points.
• Grid. Product cards in columns.

Set the view the page starts with in the collection section setting Default view. The default is Table. The theme setting Default collection view sets the same default for the store.

A buyer can change the view. The theme remembers the buyer's choice in the browser.

On a phone, each table row turns into two lines. The first line shows the title and SKU. The second line shows the pack, stock, price, quantity and the add button. The table does not scroll sideways.

Specification columns

The table view can show up to four specification columns. Each column shows one value from the product's Specifications field. See Product data.

There are two ways to set the columns:

• Specification columns in the collection section. Enter the names as a comma list. The default is Thread, Length.
• The collection metafield custom.table_columns. Use this to set different columns for one collection. It is a list of single line text.

To use the metafield:

1. In Shopify admin, go to Settings > Custom data and add a definition for Collections. Use the namespace custom, the key table_columns, and the type list of single line text.
2. Open each collection. Enter the specification names you want as columns.
3. Use the same names as the keys in the product's specification JSON. The table finds each value by its name.

The collection section setting Price group label sets the label for the price group. The default is "Price per pack".

Category tree

The category tree comes from the Catalog menu in theme settings. The menu can have three levels.

On a collection page, the category tree shows:

• The parent of the current collection.
• The collections beside it.
• The child collections, with the number of products in each.

On a desktop, the category tree is the first block of the filter sidebar. On a phone, it shows as chips above the list.

The categories index section lists the top categories with their counts. You can add it to the home page with the Category index section. See Sections.

Filters

The filters come from Shopify. They have two limits:

• Shopify hides filters on a collection with more than 5,000 products.
• A store can have at most 25 filters.

Plan your collections so that each large collection stays below 5,000 products. Split a very large collection into smaller ones, and use the category tree to move between them.

The collection section setting Filter layout sets the filters to Sidebar or Horizontal bar.

The collection toolbar shows:

• The number of products.
• The sort menu.
• The view switch.
• In stock only, which filters out products with no stock.
• A filters button on a phone.

Search

Search suggestions

The search box shows suggestions as the buyer types. Turn them on or off with the theme setting Enable search suggestions.

The suggestions show:

• Products first. Each product is a compact row with its image, title, the SKU of the matching variant, the part number, the pack, the stock, the price and a quantity box.
• A quick add button for products with one variant. The buyer does not need to open the product page.
• Collections as categories, with product counts.

Turn the price on or off with Show price. Turn the vendor on or off with Show vendor.

SKU and part number search

Type a SKU in the search box. The search matches the start of a SKU, so type at least three characters.

When a SKU matches exactly, the result shows the label "Exact match" and appears first.

The search finds a part number when the part number is stored as the variant barcode or as a product tag. It does not find a part number that is stored only in the part number metafield. See Product data.

When the search term contains a line break or a comma, the suggestions show a link to Open quick order. This helps a buyer who pasted a list of SKUs.

Limits

The search returns at most 10 results for each type of result.

Search results page

The search results page uses the same three views as a collection: table, list and grid. Set the number of results per page with Results per page. The default is 24.