> For the complete documentation index, see [llms.txt](https://templatescoder.gitbook.io/pizzon-shopify-theme-documentation/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://templatescoder.gitbook.io/pizzon-shopify-theme-documentation/theme-settings/product-card/set-up-for-product-card.md).

# Set up for Product Card

{% hint style="success" %}
**Steps:**

1. From your Shopify admin, go to **Online Store** **->** **Themes**.
2. Find the theme that you want to edit, and then click **Customize**.
3. Click **Theme settings -> Product Card -> Set up for Product Card**.
   {% endhint %}

#### 1. Product Card Image

<table><thead><tr><th>Setting</th><th>Description</th><th data-hidden></th></tr></thead><tbody><tr><td>Adapt To Image</td><td>Select the display type of media on product card: <strong>Adapt to image:</strong> the image size on product card will scale according to the image actual size.<br><strong>Portrait:</strong> The image of the product card will have a height more than its width. The ratio of the width and height can be adjusted with the "Image height (%)" setting below.<br><strong>Square:</strong> The image of the product card will be a square.</td><td></td></tr><tr><td>Image Height (%)</td><td>Fill in the desired ratio of the width and height of the product card media in %.</td><td></td></tr><tr><td>Product Image Swap</td><td>Toggle the functionality when the product card image is hovered, it will swap to the second image.</td><td></td></tr><tr><td>Product Image Loading Effect</td><td>Loading the display of placeholder when the image is being loaded due to lazy load.</td><td></td></tr><tr><td>Image Loading Effect Name</td><td>Fill in the text to be shown during the Image Loading Effect.</td><td></td></tr><tr><td>Product Vendor</td><td>Toggle to show or hide product vendor.</td><td></td></tr><tr><td>Product Price</td><td>Toggle to show or hide product price.</td><td></td></tr><tr><td>Product Size Variant</td><td>Toggle to show or hide product size variant.</td><td></td></tr><tr><td>Product Wishlist</td><td>enable product Wishlist Button</td><td></td></tr><tr><td>Product Wishlist Mobile</td><td>enable product Wishlist Button</td><td></td></tr><tr><td>Product Quick View</td><td>enable product Quick Button</td><td></td></tr><tr><td>Product Quick View Mobile</td><td>enable product Quick Button</td><td></td></tr><tr><td>Position Add to Cart, QuickView &#x26; Wishlist</td><td>Select the desired position of the add to Cart, quick view and wishlist buttons cluster either on the right or left side of product card.</td><td></td></tr><tr><td>Product Content Alignment</td><td>Select the desired position of content on the right or left side or center of product card.</td><td></td></tr><tr><td>Product Review</td><td>Toggle the display of ratings star on product card.</td><td></td></tr><tr><td>Product Quick View Type</td><td>Select the display type of quick view button on product card.<br><strong>Default:</strong> The quick view button is shown in the center of the product card when hovered.<br><strong>Icon:</strong> The quick view eye icon button is grouped with the wishlist button to the right of left side</td><td></td></tr><tr><td>Position Cart, QuickView &#x26; Wishlist</td><td>Select the desired position of the quick view and wishlist buttons cluster either on the right or left side of product card.</td><td></td></tr></tbody></table>

<figure><img src="https://4042727321-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FSkIHgFDpy0SIeYlayaAb%2Fuploads%2Fd4yuhkRit5yiPeO1MEJy%2Fscreencapture-admin-shopify-store-pizzon-themes-167476166948-editor-2025-01-11-10_52_45.jpg?alt=media&amp;token=cb7cb615-ba79-4e2b-9544-fc20077db22c" alt=""><figcaption></figcaption></figure>
