# Cards

{% embed url="<https://salesiq.zohopublic.in/signaturesupport.ls?widgetcode=siq93f38201da244cbe219b2cab71813c85342abc57dd769c6885e2bde57d2b90da>" %}

Use this setting to customize the "**Product cards**" Styles, Image Padding, Text alignment, Color scheme, Border, and Shadow.

<table><thead><tr><th width="286">Setting</th><th>Description</th></tr></thead><tbody><tr><td>Style</td><td><p>Choose the product card style:</p><ul><li>Standard</li><li>Card</li></ul></td></tr><tr><td>Text alignment</td><td><p>Customization of "Text alignment" within the product card is as follows:</p><ul><li>Left</li><li>Center</li><li>Right</li></ul></td></tr><tr><td>Heading size</td><td>You can adjust the product card heading size using this setting.  You can set heading font size in range between “16px.” to “20px.”</td></tr><tr><td>Make heading text bold</td><td>Enable this setting to set product card heading text bold.</td></tr><tr><td>Price font size</td><td>You can adjust the product card price font size using this setting.  You can set price font size in range between “16px.” to “20px.”</td></tr><tr><td>Card color scheme</td><td><p>Choose the color scheme for the product card..</p><ul><li>Scheme 1</li><li>Scheme 2</li><li>Scheme 3</li><li>Scheme 4</li><li>Scheme 5</li></ul></td></tr><tr><td>Image ratio</td><td><p>Choose how the product image ratio is displayed: </p><p></p><ul><li>Adapt to image</li><li>Square</li><li>Portrait</li></ul></td></tr><tr><td>Show second image on hover</td><td>Toggle to display the second product image when a user hovers over the product card.</td></tr><tr><td>Show quantity</td><td>By enabling this checkbox you can display the “Product quantity field”.</td></tr><tr><td>Show vendor</td><td>Toggle to show the product vendor (brand) in the product card.</td></tr><tr><td>Show product rating</td><td>Enable to display the product rating (requires a product rating app)</td></tr><tr><td>Enable quick look button</td><td>Enable this checkbox to display the "Quick look button".</td></tr><tr><td>Quick look position</td><td><p>Customization of the "Quick look position" in the all product card section is as follows:</p><ul><li>Top right</li><li>Bottom left</li><li>Bottom right</li></ul><p><strong>Enable action buttons center in mobile</strong> </p><p>By enabling this checkbox, you can show action buttons in center on mobile device.  </p><p><strong>Note</strong>: This settings only visible if 'Quick look position' is set to bottom left or bottom right.</p></td></tr><tr><td>Show countdown</td><td>By enabling this checkbox, you can show section countdown.</td></tr><tr><td>Timer ending text</td><td>The entered text will be displayed as a timer expiration message. It will appear once the date has expired.</td></tr><tr><td>Variants</td><td><p><strong>Show variant</strong><br>By enabling this checkbox you can display the “Product variants”. <br><br><strong>Show border above the variants</strong></p><p>By enabling this checkbox you can show border above the variants.<br><br><strong>Show variant label</strong><br>By enabling this checkbox you can show variant label.<br><br><strong>Variant position</strong><br>Customization of the "Variant position" in the section is as follows:<br>None<br>Bottom<br>On image<br><br><strong>Type</strong></p><p>If the type is "Dropdown," then the variant would be dropdown. And if the type is "Pills," then the variant would be Pills. The variant types are as follows:</p><p>Type:</p><ul><li>Dropdown</li><li>Pills</li></ul><p></p><p><strong>Enable color swatches</strong> <br>By enabling this checkbox will show the "Variant color."ly applicable when 'show variants' is disabled </p><p></p><p><strong>Swatch style</strong> </p><p>Customization of the "Swatch style" in the product card is as follows:</p><ul><li>Over</li><li>Rounded</li></ul></td></tr><tr><td>Stock bar</td><td><p><strong>Show stock bar</strong> <br>Check this box to display the "Stock bar" in this section.<br><br> <strong>Maximum stock</strong> <br>Adjust maximum the stock for the stock countdown. Maximum product stock can be given up to "200". <br><br><strong>Limit stock cut off</strong> <br>Adjust the limited stock cut-off for the stock countdown.<br></p><p><strong>Limit stock message</strong> <br>Display limit stock message.<br></p><p><strong>In stock message</strong> <br>Display the "In stock" message.<br></p><p><strong>Continue selling message</strong> <br>Display the "Continue selling" message. <br><br><strong>Colors</strong> <br>Customize the colors of Limited stock, In stock and Continue selling text.</p></td></tr></tbody></table>

<figure><img src="https://1041626628-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FQNL2Rsjblk1UxGDo1Rj9%2Fuploads%2FPKmhwvT0xRyR5tUMXyQF%2Fproduct-card.png?alt=media&#x26;token=0f4062d5-7fa4-4372-a1bd-bbd5e93cfb57" alt=""><figcaption></figcaption></figure>

<figure><img src="https://1041626628-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FQNL2Rsjblk1UxGDo1Rj9%2Fuploads%2Ft9jSeh8nbwYGxy4kIb94%2Fcard-variants.png?alt=media&#x26;token=9b3024d3-529e-401a-95c9-419fe82dd574" alt=""><figcaption></figcaption></figure>

<figure><img src="https://1041626628-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FQNL2Rsjblk1UxGDo1Rj9%2Fuploads%2FBVWNZWJX3mswTb2nSchV%2Fcard-stockbar.png?alt=media&#x26;token=3f739dc9-ac71-43d8-b364-75fcb0479afb" alt=""><figcaption></figcaption></figure>