# Product template

<table><thead><tr><th width="213"></th><th></th></tr></thead><tbody><tr><td>Section spacing</td><td><p><strong>Top spacing (desktop)</strong></p><p>Adjust the range bar to add spacing at the top of the section for desktop view.</p><p></p><p><strong>Bottom spacing (desktop)</strong></p><p>Adjust the range bar to add spacing at the bottom of the section for desktop view.</p><p></p><p><strong>Top spacing (mobile)</strong></p><p>Adjust the range bar to add spacing at the top of the section for mobile view.</p><p></p><p><strong>Bottom spacing (mobile)</strong> </p><p>Adjust the range bar to add spacing at the bottom of the section for mobile view.</p></td></tr><tr><td>Gallery style</td><td><p>Select the gallery style for product media from below options:</p><p>-Carousel</p><p>-Grid</p></td></tr><tr><td>Thumbnails position</td><td>Choose the thumbnails position from the following options:<br>- Left<br>- Bottom<br>It's applicable to carousel gallery style only.</td></tr><tr><td>Show sticky variant image</td><td>Select this checkbox to show the sticky variant image.<br>It's applicable with grid gallery style only.</td></tr><tr><td>Media ratio</td><td>Choose the image ratio from the following options: <br>-Auto <br>-Landscape <br>-Portrait <br>-Square</td></tr><tr><td>Colors</td><td><p><strong>Color scheme</strong><br>Select the color scheme.</p><p><em>Note: These can be managed from Theme settings> Color schemes.</em></p></td></tr></tbody></table>

## **Block settings:**

<table><thead><tr><th width="262"></th><th></th></tr></thead><tbody><tr><td>Text</td><td>This block is used to add the text about the product.</td></tr><tr><td>Title</td><td>It displays the product’s title. It has no customizable block settings available.</td></tr><tr><td>SKU</td><td><p>It displays the product <strong>SKU</strong>. There are no customizable block settings available.</p><p><em>Refer to</em> <a href="https://help.shopify.com/en/manual/products/details"><em>Product details.</em></a></p></td></tr><tr><td>Price</td><td>It displays the product’s price like <strong>Sale</strong> and <strong>Compare</strong> price. <br><br><strong>Hide shipping content</strong> <br>Tick this checkbox to hide the shipping content.</td></tr><tr><td>Variant picker</td><td>This block is to display the variant options. <br><br><strong>Option style</strong><br>Choose style from following options:<br>- Dropdown<br>- Swatch<br><br>Please refer to <strong>Theme settings > Product</strong> for the different variants styles (<strong>Dropdown</strong> and <strong>Color swatches</strong>).</td></tr><tr><td>Quantity picker</td><td>This block is to display a quantity selector, for selecting the number of products to purchase. It has no customizable block settings available.</td></tr><tr><td>Pickup &#x26; availability</td><td>It displays the product’s pickup and avaibility in locations.</td></tr><tr><td>Buy buttons</td><td>It shows the “<strong>Add to cart</strong>” and “<strong>Buy now</strong>” buttons. <br><br><strong>Show dynamic checkout button</strong> <br>Tick the checkbox "<strong>Show dynamic checkout button</strong>" to display a button with the user's preferred payment method, in addition to the "<strong>Add to cart</strong>" button.<br><br>Show recipient information form for gift card products<br>Tick the checkbox to show the recipient form on the gift products only.<br>(<strong>Note</strong>: Gif<em>t card products can optionally be sent direct to a recipient along with a personal message.)</em></td></tr><tr><td>Social sharing</td><td>Add this block to show the social sharing icons.</td></tr><tr><td>Complementary products</td><td>To select complementary products, add the Search &#x26; Discovery app.<br><br><strong>Heading</strong><br>Enter the heading text.<br><br><strong>Products count</strong><br>Adjust the range bar to determine the number of products to display.</td></tr><tr><td>Custom liquid</td><td><p>This is used to add custom liquid code for any advanced customizations such as app snippets.<br></p><p>For more understanding, refer to-<a href="https://shopify.dev/docs/themes/liquid/reference">Shopify developers: Liquid reference</a>.</p></td></tr><tr><td>Collapsible content</td><td><strong>Main heading</strong><br>Enter the heading text.<br><br><strong>Show product description</strong><br>Select the checkbox to show product description.<br><br><strong>Description heading</strong><br>Enter the description heading text.<br><br>Content 1-3<br><strong>Heading</strong><br>Enter the heading text.<br><br><strong>Description</strong><br>Enter the description text or use dynamic source to add the data.</td></tr><tr><td>Icon and text</td><td>Icon 1- 3<br><strong>Icon</strong><br>Select icon from the list of icons.<br><br><strong>Custom icon</strong><br>Add the icon image.<br><em>(<strong>Note</strong>: It has higher priority than the list of icons.)</em><br><br><strong>Heading</strong><br>Enter the heading text.</td></tr></tbody></table>
