# Featured product

<table data-header-hidden><thead><tr><th width="281"></th><th></th></tr></thead><tbody><tr><td>Section visibility</td><td>Choose from the options to select the visibility of this section: <br>-Always <br>-Small devices only(On selecting this, the section will be visible on mobile devices only.) <br>-Large devices only</td></tr><tr><td>Make top corners rounded</td><td>Select this checkbox to show the top corners rounded of the section.</td></tr><tr><td>Product</td><td>Choose any product to display.</td></tr><tr><td><p>Enable product </p><p>thumbnails</p></td><td>Tick this checkbox to display the product image's thumbnails.</td></tr><tr><td>Desktop thumbnails position</td><td>Choose from the left or bottom to decide the thumbnail position.</td></tr><tr><td>Overlap thumbnails</td><td>Select this checkbox to overlap the thumbnails on product images.<br><em>(Note: It will work only when thumbnail position is set to bottom.)</em></td></tr><tr><td>Desktop grid image ratio</td><td>Choose the product image ratio from the following options for the desktop view:<br>-Auto<br>-Landscape<br>-Portrait<br>-Square</td></tr><tr><td>Image zoom</td><td>Choose the image zoom options from the following options:<br>- Click and hover<br>- Open lightbox<br>- None<br><em>(Note: Click and hover does not work on mobile.)</em></td></tr><tr><td>Mobile</td><td><strong>Show thumbnails on mobile view</strong><br>Select this checkbox to show the thumbnails on the mobile.<br><em>(Note: This setting will work with enabled product thumbnails.)</em><br><br><strong>Mobile grid image ratio</strong><br>Choose the product image ratio from the following options for the mobile view:<br>-Auto<br>-Landscape<br>-Portrait<br>-Square</td></tr><tr><td>Heading</td><td><strong>Text</strong><br>Type any text to display as a title.<br><em>(Note: To highlight the text with a different color, simply wrap it in bold.)</em><br><br><strong>Heading size</strong><br>Choose the heading size in between H1 to H6.<br><br><strong>Heading tag</strong><br>Choose the heading tag for SEO and search engines for crawling purposes.<br><br><strong>Heading alignment</strong><br>Choose the heading alignment from left or center.</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><br><br><strong>Section background</strong><br>Choose any color for the section background color. It works with the rounded corners only.<br><br><strong>Heading highlight</strong><br>Choose any color for the highlighted heading color.</p></td></tr><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.<br></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.<br></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.<br></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></tbody></table>

#### **Block settings:**

<table data-header-hidden><thead><tr><th width="286"></th><th></th></tr></thead><tbody><tr><td>Title</td><td>It displays the product’s title. It has no customizable block settings available.<br><br><strong>Heading size</strong><br>Choose the heading size in between H1 to H6.</td></tr><tr><td>Review rating</td><td>It displays customer reviews and ratings. These reviews can be included by adding the <strong>Shopify reviews app</strong>.<br>Please refer to <a href="https://apps.shopify.com/product-reviews">Product Review app</a>. </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"> </a><a href="https://help.shopify.com/en/manual/products/details"><em>Product details</em></a><em>.</em></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. 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>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.</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.</p><p>For more understanding, refer to <a href="https://shopify.dev/docs/themes/liquid/reference">Shopify developers: Liquid reference</a><a href="https://shopify.dev/docs/api/liquid">.</a></p></td></tr><tr><td>Icon with text</td><td><strong>Icon 1-3</strong><br><br><strong>Icon</strong><br>Choose any icon from the available list of icons.<br><br><strong>SVG code</strong><br>Add the SVG code of the icon.<br><br><strong>Heading</strong><br>Add the heading text.</td></tr></tbody></table>