Products, collections, cart and search
Understand product-card, quick-buy, collection, cart, and search decisions across Strata.
These answers follow the path from finding a product to choosing an option, adding it to the cart, and continuing discovery.
Why do Product card settings affect several pages?
Collection grids, product lists, Search product results, recommendations, and recently viewed products use the shared Product card presentation. Global Product card settings therefore create a consistent card across those surfaces, while each section or template controls its own product source, count, and grid or carousel layout.
Use the global guide for card content and appearance. Use the relevant section or template guide when the issue is which products appear or how the surrounding grid is arranged.
When does quick buy add directly or open another view?
With Show quick buy enabled:
- an available product with one default variant can add directly;
- a product with several variants uses the product quick-view path on desktop and the full Product page on mobile;
- an unavailable selected variant does not offer the normal add action;
- products with selling plans use the Product page instead of product-card quick buy.
Preview all four product states before relying on quick buy as the only purchase path. See Product card and Product.
Why does Color display mode: Hide still show swatches?
Known current limitation: the current Product card source normalizes Color display mode: Hide back to the Swatch presentation. Do not treat Hide as a guaranteed hidden state in this version. To remove eligible color choices from product cards, turn off the separate Show color swatches control.
The global Color swatches setting remains the master control for swatch data, and Show on product pages separately controls eligible Product-page pickers. This limitation belongs to Product cards; it does not mean the product's color option has been removed.
Why are color swatches missing?
Product-card swatches need all of the following:
- global Enable color swatches is on;
- Product card Show color swatches is on;
- the product has a native swatch or a Color/Colour option that Strata can match.
Native Shopify swatch data takes priority. Custom color mappings are fallback presentation data and must match the option value. A Product page also has its own Show on product pages gate. See Color swatches for matching and accessibility guidance.
Which Product media layout should I use?
Grid layouts keep several media items visible for comparison but turn off desktop product-video autoplay. Thumbnail layouts concentrate attention on one active item. Background gallery creates the most immersive presentation and can participate in the transparent-Header relationship.
Image zoom applies to image media, while video and 3D media keep their own controls. Use Product for the exact layout names and local media settings.
Why does a Product option open differently on mobile?
Eligible color options can use swatches. Other Product-page options use an enhanced dropdown on desktop and a mobile option sheet. This keeps long option lists within the smaller viewport while preserving a direct desktop selector.
The Product Style setting exposes Auto, Swatches, and the merchant-facing Desktop dropdown / mobile option sheet choice. The current schema retains two compatibility values with that same visible label. Check the selected and unavailable variants in both viewports rather than expecting the same control shape everywhere.
What is the difference between recommendations and recently viewed products?
| Surface | Product source |
|---|---|
| Product recommendations | Shopify related or complementary recommendations, unless manually selected products replace them |
| Recently viewed products | The current browser's permitted local viewing history, excluding the current product |
Recently viewed history is not an account-level list and does not synchronize across browsers or devices. Either section can stay hidden when it has no eligible products.
Why are Collection banner and Collection separate?
The current saved Collection template begins with Collection banner, followed by Collection.
- Collection banner owns the title, breadcrumbs, hero media, parallax, colors, and transparent-Header eligibility.
- Collection owns category shortcuts, filters, sorting, product loading, the grid, and promotional or subscribe blocks.
Open the section that owns the result you want instead of looking for hero controls inside the product-grid section.
Why are filters or category shortcuts missing?
The theme can display only filters Shopify supplies for the current result set. Enable filtering does not create filter definitions or product data. Show category shortcuts uses the Shopify category filter when available and falls back to product type.
Check Shopify's filter configuration and the products in the current collection before treating an empty control as a theme issue. See Collection for the filter and loading settings.
How should I choose Infinite scroll or Pagination?
Use Infinite scroll for continuous browsing. Use Pagination when shoppers benefit from a stable page sequence or need to return to a known result page. Promotional and Subscribe banners are inserted relative to product boundaries, so their exact location also depends on the products available in the current batch.
The canonical Collection guide records the current loading quantities and block-placement rules. When the current result has no next page, the progress summary receives a visual completion mark; it is browsing feedback, not a merchant setting. Browser loading and history behavior still need accepted verification.
Why does Cart open a drawer on one page and a page on another?
Global Enable cart drawer chooses the normal route. When it is off, Cart links open the full Cart page. When it is on, the Header can open the Cart drawer, except on the Cart page itself, where the shopper is already in the full cart flow.
The free-shipping progress is shared by the drawer and page. It appears only for a non-empty cart with a positive threshold and the store's own currency. Configure the global behavior in Cart and page-specific content in the Cart template.
Where do Complete with products come from?
The Cart drawer requests up to 4 related recommendations from Shopify for the first product in the cart. Complete with is not a complementary-recommendation picker, and the Cart drawer does not expose a merchant product selector. The row can therefore remain empty when Shopify has no eligible related result. See Cart drawer for the exact drawer contract.
Why is the free-shipping bar missing?
The bar is hidden when the cart is empty, Free shipping minimum amount is blank or 0, or the shopper is not using the store currency. The threshold is not converted into a promise for every market. Check Cart settings before changing unrelated drawer or page content.
What appears before and after I type in Search?
The predictive Search drawer keeps its configured Featured links and Trending products for an empty query or a trimmed query shorter than 2 characters. At 2 or more characters, it can return up to 3 suggested queries plus product and article resources.
When both resource types have results, the merchant-visible tabs are Products and Blog posts, with Products selected first. When only one resource type is available, that group appears directly without an unnecessary tab switcher. The full Search page is a different surface: it can include products, blog posts, and pages in the result set, with its own filtering, sorting, excerpts, and pagination.
Do not expect the drawer tabs and full-page result layout to match.
If the result differs
Use one representative product or collection and record its availability, variants, selling plans, filters, currency, and query. Then follow the canonical guide or Troubleshooting without changing unrelated global card settings.