> For the complete documentation index, see [llms.txt](https://mpithemes.gitbook.io/unicorn-shopify-theme/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://mpithemes.gitbook.io/unicorn-shopify-theme/dynamic-theme-sections/blocks/header/button.md).

# Button

## Button

**Spacing above**\
Adjust the distance above the button using a scale from 0 to 60 pixels.

**Placement**\
Choose where the button is displayed within the section.

* **"Default"**. Displays the button in its default position based on the layout.
* **"Bottom"**. Places the button at the bottom of the section.
* **"Bottom on mobile"**. Places the button at the bottom of the section on mobile devices only.
* **"Bottom on tablet"**. Places the button at the bottom of the section on tablet devices only.

**Label**\
Enter the text displayed on the button.

**Link**\
Select a page or paste a URL that opens when customers click the button.

**Open in new tab**\
Enable this option to open the linked page in a new browser tab.

**Style**\
Select the desired style in the drop-down: "Primary", "Secondary", or "Link style". 

**Color**\
Applies color settings according to the selected button style:

* **"Primary"**. Changes the button background color.

<figure><img src="https://2943342198-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FysL5Hr1ZCl3x5RHWgJ3m%2Fuploads%2FwsnQ82l8LO19lNKM2OT6%2Fbutton%20style_primary.png?alt=media&amp;token=2b96b72d-554c-4eaa-a871-47fc1453709d" alt="" width="145"><figcaption></figcaption></figure>

* **"Secondary"**. Colorizes the text and border.

<figure><img src="https://2943342198-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FysL5Hr1ZCl3x5RHWgJ3m%2Fuploads%2FXs6k6jAVcGqh6Qz0Oiqt%2Fbutton%20style_secondary.png?alt=media&amp;token=0ebdb61b-45c1-4259-a37a-9eef44a1195a" alt="" width="148"><figcaption></figcaption></figure>

* **"Link style"**. Changes the text color.

<figure><img src="https://2943342198-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FysL5Hr1ZCl3x5RHWgJ3m%2Fuploads%2FY2rddMsZpviQKC7zMyyj%2Fbutton%20style_link.png?alt=media&amp;token=ea4a1ce7-449e-49a3-af2c-79b2df8415d6" alt="" width="134"><figcaption></figcaption></figure>

***

## Two buttons

Use the block to add buttons side by side. Press **"Add block"** to add a new block.\
The available settings are described [<mark style="color:blue;">above</mark>](#button).