# Product form

Adjust the style and functionality of your variant selectors and 'add to cart' buttons.

<figure><img src="/files/5GZ0rwf3Wef9eIPBfdjF" alt=""><figcaption></figcaption></figure>

<table><thead><tr><th width="222.8194580078125">Settings</th><th width="134.7431640625" align="center">Type</th><th>Description</th></tr></thead><tbody><tr><td>Show gray background behind images</td><td align="center"><code>checkbox</code></td><td>Adds a gray background behind product images.</td></tr><tr><td>Variants style</td><td align="center"><code>select</code></td><td>Choose how the variant options display: <code>Auto</code>, <code>Boxes</code>, or <code>Dropdowns</code>.</td></tr><tr><td><strong>Variant image</strong></td><td align="center"></td><td></td></tr><tr><td>Show variant image</td><td align="center"><code>checkbox</code></td><td>Displays images linked to variant selection.</td></tr><tr><td>Swatch style</td><td align="center"><code>select</code></td><td>Layout style for variant images: <code>Stacked</code> or <code>In-line</code>.</td></tr><tr><td><strong>Media</strong></td><td align="center"></td><td></td></tr><tr><td>Enable video looping</td><td align="center"><code>checkbox</code></td><td>Loops any product video media.</td></tr><tr><td><strong>Out of stock notification</strong></td><td align="center"></td><td></td></tr><tr><td>Show ‘Notify me when available’ popup</td><td align="center"><code>checkbox</code></td><td>Displays a newsletter-style popup on out-of-stock items.</td></tr><tr><td><strong>Final sale</strong></td><td align="center"></td><td></td></tr><tr><td>Show on all sale products</td><td align="center"><code>checkbox</code></td><td>Globally show disclaimer on all sale products.</td></tr><tr><td>Content on hover</td><td align="center"><code>text</code></td><td>Tooltip message (hover text).</td></tr><tr><td>Color</td><td align="center"><code>color</code></td><td>Color of the final sale label.</td></tr><tr><td><strong>Add to cart button</strong></td><td align="center"></td><td></td></tr><tr><td>Show button with 50% width</td><td align="center"><code>checkbox</code></td><td>Displays button at half width (desktop only).</td></tr><tr><td>Display product price</td><td align="center"><code>checkbox</code></td><td>Adds price to the button (stacks if 50% width is active).</td></tr><tr><td>Button color</td><td align="center"><code>select</code></td><td>Choose from: <code>Primary</code>, <code>Secondary</code>, <code>White</code>, <code>Black</code>.</td></tr><tr><td>Button style</td><td align="center"><code>select</code></td><td>Options: <code>Solid</code>, <code>Outline</code>, <code>Solid with border</code>, <code>Soft</code>.</td></tr><tr><td>Size</td><td align="center"><code>select</code></td><td>Options: <code>Small</code>, <code>Medium</code>, <code>Large</code>.</td></tr><tr><td><strong>Buy it now button</strong></td><td align="center"></td><td></td></tr><tr><td>Button color</td><td align="center"><code>select</code></td><td>Choose from: <code>Primary</code>, <code>Secondary</code>, <code>White</code>, <code>Black</code>.</td></tr><tr><td>Button style</td><td align="center"><code>select</code></td><td>Options: <code>Solid</code>, <code>Outline</code>, <code>Solid with border</code>, <code>Soft</code>.</td></tr><tr><td>Size</td><td align="center"><code>select</code></td><td>Options: <code>Small</code>, <code>Medium</code>, <code>Large</code>.</td></tr><tr><td><strong>Gift card</strong></td><td align="center"></td><td></td></tr><tr><td>Show recipient information form for gift card products</td><td align="center"><code>checkbox</code></td><td>Displays an optional form to email gift cards directly to a recipient. </td></tr><tr><td><strong>Quantity selector</strong></td><td align="center"></td><td></td></tr><tr><td>Style</td><td align="center"><code>select</code></td><td>Choose from: <code>Dropdown</code> or <code>Standard</code>.</td></tr></tbody></table>


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://palo-alto.presidiocreative.com/theme-settings/settings/product-form.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
