Product Card Information
Overview
Controls the visibility, layout, and styling of product information elements inside the product card.
Layout
Defines how product information is structured:
- Single Column → All information stacked vertically
- Two Columns → Information arranged side-by-side for compact layout
Sections (Show / Hide)
Each information block can be enabled or disabled individually:
- Metafield List → Displays custom metafield data
- Badges → Shows product labels (e.g., sale, new)
- Reviews → Displays product ratings
- Product Options → Shows variant or option details
- Subscription → Displays subscription-related info
- Price → Shows product price
- Inventory / Stock → Displays stock availability
Styling
Each element can be styled independently:
Product Title
- Color
- Font family
Text Elements
- Color
- Typography
Price
- Color and emphasis styling
Badges
- Background color
- Text color
Spacing
- Controls gap between information blocks
- Adjusts readability and layout balance
Behavior
- Sections appear only when enabled
- Layout updates instantly when switching between single and two column
- Styling changes apply globally to all product cards
Responsive Behavior
- Automatically adjusts layout on smaller screens
- Two-column layout may stack for better readability on mobile
Summary
Product Card Information allows full control over:
- What information is shown (visibility)
- How it is structured (layout)
- How it looks (styling)
This ensures a clean, flexible, and well-organized product card experience.
