# Product listings

**Product listings** are products displayed on collection pages and in sections. Each product card displays the product's image, title, and price, along with optional features like quick shopping and badges.

In your theme editor, go to **Theme settings > Product listings** to customize the style and features of product cards.

<div><figure><img src="https://2417329470-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fhnqe0uck0ozZhJ77wGXt%2Fuploads%2FultjXiE1xlfgFNad0qLC%2Ftheme-setting-listing.png?alt=media&#x26;token=ff10cea3-6789-46c1-bf2c-f494728db0ea" alt="" width="264"><figcaption></figcaption></figure> <figure><img src="https://2417329470-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fhnqe0uck0ozZhJ77wGXt%2Fuploads%2FrTDcuVyfpluor92bxNBU%2Fproduct-hover.jpeg?alt=media&#x26;token=ab1773ab-e8d5-4de7-bc47-554fb4a03a64" alt="" width="375"><figcaption></figcaption></figure></div>

<table data-view="cards"><thead><tr><th></th><th></th><th data-hidden data-card-target data-type="content-ref"></th></tr></thead><tbody><tr><td><mark style="color:blue;"><strong>Product card details</strong></mark></td><td>Show vendor, swatches, chips, border, and rating stars.</td><td><a href="product-card-style#product-card-details">#product-card-details</a></td></tr><tr><td><mark style="color:blue;"><strong>Product image styles</strong></mark></td><td>Change image shape and show secondary image on hover.</td><td><a href="product-card-style#product-card-images">#product-card-images</a></td></tr><tr><td><mark style="color:blue;"><strong>Product badges</strong></mark></td><td>Show sale, sold-out, and custom badges.</td><td><a href="product-badges">product-badges</a></td></tr><tr><td><mark style="color:blue;"><strong>Quick shopping</strong></mark></td><td>Show Quick view or Quick add button.</td><td><a href="quick-view">quick-view</a></td></tr><tr><td><a href="prices-and-discounts"><strong>Prices and discounts</strong></a></td><td>Change how prices and discounts are displayed.</td><td><a href="prices-and-discounts">prices-and-discounts</a></td></tr></tbody></table>

&#x20;