AnvilDocs v1.0.0 Contact support

Collections and search

Collection pages and search results share the same layout: filters on the left, a toolbar with sorting and the layout switch, and the product grid or list.

Filters

Anvil supports Shopify's built-in storefront filtering. To choose which filters appear:

  1. Install the free Shopify Search & Discovery app from Shopify.
  2. In the app, go to Filters and add filters such as Availability, Price, Product type, Vendor, or any product or variant metafield.
  3. Make sure Enable filtering is on in the Product grid and Search results sections.

Filters update the results without reloading the page. Customers can remove one filter with its chip or clear them all. On small screens, filters open in a drawer. Color filters show swatches when the option values have swatches.

Filters don't appear on collections with more than 5,000 products. This is a Shopify limit.

List layout

The list layout is a dense, technical view of the catalog. Each row shows the image, title, SKU, price, stock status, a quantity field, and up to 3 specifications.

Sorting

Turn on Enable sorting to let customers sort by featured, best selling, alphabetical order, price, or date. The default sort order for a collection is set in the collection's admin page.

Search matches product titles, product types, vendors, tags, variant titles, SKUs, and barcodes. Customers can type a part number like HB-M8-40 and go straight to the right product.

As customers type, search suggestions show matching products, collections, pages, blog posts, and suggested searches. Use the arrow keys to move through suggestions and Enter to open one. Configure suggestions in Theme settings > Search:

Search suggestions only work with the Online Store sales channel's built-in search. Synonyms and product boosts can be set in the Search & Discovery app.

Product cards

The look of product cards is set for the whole store in Theme settings > Product cards: image ratio and fit, vendor, SKU, stock status, and quick add. Show quick add adds an Add to cart button to cards for products that have no options. Products with options link to the product page so customers can choose a variant.

Empty collections and no results

When a collection has no products, or when filters or a search match nothing, Anvil shows a clear message with a way to clear filters or search again. You don't need to set anything up.