Skip to content

Product List Item

File: snippets/product-list-item.liquid

Used in sections: collection-mixed, collection-product-store, page-person, product-related-products

Screenshot not yet added.
Save as docs/src/assets/screenshots/snippet-product-list-item.png

Description

Product List Item

Renders a product card with three layout variants: “full” (image with overlay title and type badge), “store” (image, title, description, and price), and default (type header bar, image, title, and price). Detects product type from tags and metafields, supports prerequisite overlay badges, and handles multi-value product_type metafields.

Features:

  • Three layout modes: “full”, “store”, and default
  • Product type detection from tags (online, residential, regional, virtual)
  • Multi-value product_type metafield parsing and display
  • Prerequisite required overlay badge with icon
  • First 4 products rendered (index < 5 guard)
  • Truncated description in store layout
  • Price display (single or range)

Usage

{% render 'product-list-item' %}