Curio / Rock On App

08 Configure

Collections and search

Grids, filters, sorting, pagination, and the search results page.

The collection page#

Theme editor → template dropdown → Collections → Default collection. The section is Collection.

SettingDefaultNotes
Show collection imageonSits as a plate above the grid
Show descriptionon
Products per page248–48
Columns on desktop42–5
Columns on mobile21 or 2
PaginationNumbered pagesOr a load-more button, or load as you scroll
Enable filteringonNeeds filters configured — see below
Enable sortingon

The grid is a contact sheet: hairline-framed cells sharing borders, each carrying its own lot number counting down the page. Two columns on a phone is the default because resale shoppers scan; drop to one column if your photography deserves the space.

Filters#

Filters come from Shopify, not from the theme. Install the free Search & Discovery app, open Filters, and add the ones you want. Until you do, the filter column has nothing to show and the theme hides it.

The filters worth adding for resale stock, roughly in order of usefulness:

FilterSource
SizeA product option, or a metafield
ConditionYour curio.condition_grade metafield, or a tag
BrandThe product vendor
Era or decadeA tag, or curio.era
PriceBuilt in
AvailabilityBuilt in

Filtering keeps working with JavaScript disabled — every filter is a real link and the form has a real submit button. When JavaScript is on, results update in place and the count is announced to screen readers.

A filter combination with no matches gets a proper empty state with a way back out, rather than a blank page.

Filter on a metafield. In Search & Discovery, filters can be built from metafield definitions — which is how Condition: A — Excellent becomes a filter. The definition has to exist first; see the metafield setup.

Pagination#

Three options, and the choice matters more than it looks:

  • Numbered pages — the default, and the best one for a catalog you want indexed.
  • Load more button — a button appends the next page. Shoppers stay in control.
  • Load as you scroll — pages append automatically as the shopper reaches the bottom.

With every option, the numbered navigation is always rendered in the page and merely hidden when JavaScript takes over. Search engines and shoppers without JavaScript always get a real paginated path through your catalog. Infinite scroll never strands anyone.

Product cards#

The card treatment is set once in Theme settings → Product cards and used everywhere products appear. It carries:

  • The lot number, and the era or vendor eyebrow.
  • The condition stamp, if the product has a grade.
  • A price tag, with compare-at struck through as a corrected entry.
  • One badge at most — reduced, new, or low stock, as configured in Theme settings → Badges.
  • Verso hover — a second photo crossfades in on hover, if the product has one. No JavaScript, and nothing happens on touch devices, where hover is a lie.
  • Quick view, which opens the product in a dialog, and optional quick add for single-variant products.
  • For a product with no image at all, an oversized lot number as deliberate art rather than a broken frame.

The collections list page#

The Collections list template shows all your collections. 8–48 per page, 2–4 columns on desktop, with optional product counts.

For a denser alternative, add the ledger index section instead — collections as ruled table rows with live counts.

Curio’s search page returns products, collections, pages, and articles, filtered and sorted like a collection.

SettingDefault
Results per page24 (8–48)
Columns on desktop4 (2–5)
Columns on mobile2
Enable filteringon
Enable sortingon

The result count is announced to screen readers, and a search with no results gets a real empty state.

Typing in the search field shows suggestions across all four content types. Switch it off in Theme settings → Search.

The script that powers it is fetched the first time someone interacts with the search field, not on page load — so the 90% of visits that never search pay nothing for it.

Making search better#

Search quality is Shopify’s, not the theme’s, but two things help a lot:

  1. Synonyms, in the Search & Discovery app. Resale catalogs live and die on these: sweatshirtcrewneck, trainerssneakers, Levi’sLevis.
  2. Words in your titles. A title of “Vintage 1990s Carhartt Detroit Jacket — Brown Duck, Size L” is findable. “Lot 0421” is not.