# Shopify Product Card Builder

The Product Card Builder lets you design how products appear on Nimstrata search results and collection pages without editing Liquid or rebuilding your theme.

# Start With a Template or Start From Scratch

When you open the builder, you can:

• Start with a Nimstrata template
• Start without a template and build your own layout

Templates are the fastest way to launch. You can then refine the layout to match your branding, product data, and conversion goals.

# Common Product Card Components

Depending on your layout, the builder can be used to assemble components such as:

• Product image
• Image gallery
• Product title
• Brand
• Price
• Ratings and review count
• Variant options such as size or color
• Product metafields
• Add to Cart buttons
• Custom components

# Product Metafields and Custom Components

If your storefront design needs more than the default card elements, you can:

• Add product metafields to the card layout
• Use Custom Components only when the built-in card components are not enough
• Fetch additional Shopify Storefront API data inside a custom component when needed

Custom components are a good fit for advanced badges, quick views, wishlists, extra product metadata, or any layout that needs custom JavaScript behavior.

# Good Practices

• Keep image, title, and price above the fold on the card
• Use consistent card heights to avoid uneven grids
• Test layouts on both search and collection pages
• Fix data quality issues in imports first, then refine card design