# \[Block] Buy buttons

1. Select the **featured product** option from the theme editor.
2. Click on **Add block**. Select **Buy buttons** from **Theme Block** dropdown.

<table><thead><tr><th width="234">Setting</th><th>Description</th></tr></thead><tbody><tr><td>Show quantity selector</td><td>Select this checkbox to show/hide <strong>quantity selector</strong></td></tr><tr><td>Show wishlist</td><td>Select this checkbox to show/hide <strong>wishlist</strong></td></tr><tr><td>Show dynamic checkout buttons</td><td>Select this checkbox to show/hide <strong>dynamic checkout buttons</strong>.<br>Using the payment methods available on your store, customers see their preferred option, like PayPal or Apple Pay. <a href="https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout">Learn more</a>.</td></tr><tr><td>Show pickup availability</td><td>Select this checkbox to show/hide <strong>pickup availability.</strong> <a href="https://help.shopify.com/en/manual/sell-in-person/shopify-pos/order-management/local-pickup-for-online-orders">Learn more</a></td></tr><tr><td>Show recipient form for gift card products</td><td>Select this checkbox to show/hide <strong>recipient form for gift card products</strong>. When enabled, gift card products can optionally be sent to a recipient with a personal message.</td></tr></tbody></table>

#### 'Add to cart' button

<table><thead><tr><th width="235">Setting</th><th>Description</th></tr></thead><tbody><tr><td>Text</td><td>Set the color for the text</td></tr><tr><td>Background</td><td>Set the background color for this block<br><em><mark style="color:red;">(If a background gradient is set, the section's background will be set according to the background gradient setting)</mark></em></td></tr><tr><td>Background gradient</td><td>Set the background gradient for this block</td></tr><tr><td>Text hover</td><td>Set the color for the text on hover</td></tr><tr><td>Background hover</td><td>Set the background color for this block on hover<br><em><mark style="color:red;">(If a background gradient is set, the section's background will be set according to the background gradient setting)</mark></em></td></tr><tr><td>Background gradient hover</td><td>Set the background color for this block on hover</td></tr></tbody></table>

#### 'Buy it now' button

<table><thead><tr><th width="235">Setting</th><th>Description</th></tr></thead><tbody><tr><td>Text</td><td>Set the color for the text</td></tr><tr><td>Background</td><td>Set the background color for this block<br><em><mark style="color:red;">(If a background gradient is set, the section's background will be set according to the background gradient setting)</mark></em></td></tr><tr><td>Background gradient</td><td>Set the background gradient for this block</td></tr><tr><td>Text hover</td><td>Set the color for the text on hover</td></tr><tr><td>Background hover</td><td>Set the background color for this block on hover<br><em><mark style="color:red;">(If a background gradient is set, the section's background will be set according to the background gradient setting)</mark></em></td></tr><tr><td>Background gradient hover</td><td>Set the background color for this block on hover</td></tr></tbody></table>

#### 'Wishlist' button

<table><thead><tr><th width="235">Setting</th><th>Description</th></tr></thead><tbody><tr><td>Text</td><td>Set the color for the text</td></tr><tr><td>Background</td><td>Set the background color for this block</td></tr><tr><td>Text hover</td><td>Set the color for the text on hover</td></tr><tr><td>Background hover</td><td>Set the background color for this block on hover</td></tr></tbody></table>

#### Block padding

<table><thead><tr><th width="235">Setting</th><th>Description</th></tr></thead><tbody><tr><td>Top margin</td><td>Determines the height of the top outside space of the section. Can be from <strong>0px</strong> to <strong>50px</strong>, increasing arithmetically of <strong>1px</strong> (pixel).</td></tr><tr><td>Bottom margin</td><td>Determines the height of the bottom outside space of the section. Can be from <strong>0px</strong> to <strong>50px</strong>, increasing arithmetically of <strong>1px</strong> (pixel).</td></tr></tbody></table>
