# Image banner

The Image banner section uses a high-resolution image, text, and a call-to-action button to display immersive content.

![image](https://docs-assets.foxecom.app/megamog-theme/image_VwsenA47.png)

<Hint type="success">

Steps

1. In the theme editor (**Customize**), click **Add section**
2. Select **Image banner**
3. **Save**

</Hint>

## Section settings

### General settings

Change the **Layout**, **Banner height**, and the **Color scheme**.

**Banner height** options include:

* Adapt to image
* Small
* Medium
* Large
* Full screen

![image](https://docs-assets.foxecom.app/megamog-theme/image_MHHG9dWm.png)

### Image settings

Add an image and a link to redirect customers to your desired page (if needed).

![image](https://docs-assets.foxecom.app/megamog-theme/image_WZ7EoxeB.png)

### Content settings

Set your **Content position** and **Content alignment**.

![image](https://docs-assets.foxecom.app/megamog-theme/image_p07t4nmc.png)

### Mobile settings

![image](https://docs-assets.foxecom.app/megamog-theme/image_vX6kNnVO.png)

You can set a different image banner for your mobile view.

If you want to display your content under the image for mobile view, check the option **Stack images on mobile**.

![image](https://docs-assets.foxecom.app/megamog-theme/image_947X6wv4.png)

Adjust the **Content alignment** for the mobile view as Left/Center/Right.

## Block settings

![image](https://docs-assets.foxecom.app/megamog-theme/image_ztKMpVCx.png)

Add and edit your **Heading**, **Subheading**, **Description**, and **Button** to your liking. You can drag and drop the block to reorder it.

### Button settings

Give your button a label and select its style.

Button styles include:

* Primary
* Secondary
* Outline
* Underline
* Plain

![image](https://docs-assets.foxecom.app/megamog-theme/image_sRik5AkT.png)