# Image with button (Mobile)

{% hint style="success" %}
**Tip:** To add a block, press **"Add block"** and choose **"Image with button (Mobile)"** from the proposed list of blocks.
{% endhint %}

<mark style="color:orange;">**Note!**</mark> This block can be added for each parent menu item that contains nested menu items. How to create the drop-down menus can be read [<mark style="color:blue;">here</mark>](https://help.shopify.com/en/manual/online-store/menus-and-links/drop-down-menus).

In the **"Menu item name"** field, paste the parent link name for which the image will be applied. Note that this is a case-sensitive setting. Add the parent link name in lowercase or uppercase as used in your *Shopify admin -> Content -> Menus*.

### Block link

Use the **"Link"** source selector to redirect customers to the needed page when hitting the call-to-action button overlaid on the banner or the banner itself.

### Media

In the **"Image"** picker, press **"Select"** to choose one from the image library or upload it from your computer.

### Button

To overlay a button on a banner, insert a meaningful phrase into the **"Label"** field. If you need to hide the button, leave the field blank.

The **"Style"** drop-down allows you to set up different button layouts. Choose one of the pre-set styles: "Primary" or "Secondary". Use the following [<mark style="color:blue;">link</mark>](https://mpithemes.gitbook.io/unicorn-shopify-theme/dynamic-theme-sections#buttons) to view how each button style is presented in the theme.

Use the **"Color"** picker to set the desired color for the button. The color will be applied to the text, background, or border of the call-to-action button, depending on the "Style" previously selected in the block.

In the following example, you can view how the settings might be displayed in the drawer:

<figure><img src="https://2943342198-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FysL5Hr1ZCl3x5RHWgJ3m%2Fuploads%2Flw2LtahMbKAt7idUJiWW%2Fimage%20with%20button_mobile%20header.png?alt=media&#x26;token=d9acf8e4-e3b3-434f-af7c-230e3c3d4843" alt=""><figcaption></figcaption></figure>

{% hint style="warning" %}
**Note!** To display the block on mobile, ensure that you set up a drop-down menu in your admin for the used parent item. The banner block will be displayed on the next step after clicking the parent link.
{% endhint %}

<figure><img src="https://2943342198-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FysL5Hr1ZCl3x5RHWgJ3m%2Fuploads%2FWxFVF3IMmEdjnizVdGRy%2Fheader_link%20item.png?alt=media&#x26;token=987d03aa-f969-4f30-8ad2-baf87aaf20a4" alt=""><figcaption></figcaption></figure>