# Image Banner ✨

<figure><img src="https://684475164-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FqscUgPkTIpsIESKMa0Of%2Fuploads%2F7QmzBD6Fi07jqfjzJHOZ%2Fimage.png?alt=media&#x26;token=a6094fbd-c99e-40e2-93f6-5ef95d7bc444" alt=""><figcaption></figcaption></figure>

The Image Banner section is a decorative content block that combines multiple floating product images with a central content area featuring a title, description, and call-to-action button.&#x20;

This visually striking section uses absolute-positioned decorative images (up to 5) that create an artistic, collage-style layout around the main message.

### **Setting** Image Banner

Go to **Storefront** -> **My Themes** -> **Customize**. <mark style="color:red;">(If your store is a new store, you may need to go to</mark> <mark style="color:red;"></mark><mark style="color:red;">**Channel Manager -> Themes -> Edit Theme**</mark><mark style="color:red;">)</mark>

In the **Theme Editor** -> Go to **Home Page / Image Banner**

<figure><img src="https://684475164-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FqscUgPkTIpsIESKMa0Of%2Fuploads%2FGF1PHuuJrVrx0jCQKmqd%2Fimage.png?alt=media&#x26;token=2e721538-e5b7-4155-9036-a8358fe2b083" alt=""><figcaption></figcaption></figure>

**Main Content Settings**

| Setting                               | Description                | Example                           |
| ------------------------------------- | -------------------------- | --------------------------------- |
| **Show Block**                        | Enable/disable the section | ✓ Enabled                         |
| **Homepage Image Banner Title**       | Main headline text         | "A PILLOW STORY"                  |
| **Homepage Image Banner Description** | Supporting text            | "Let's hear something about HALO" |
| **Homepage Image Banner Button Text** | CTA button label           | "About HALO"                      |
| **Homepage Image Banner Button Link** | Button URL                 | "/about-us"                       |

**Decorative Image Assets (1-5)**

Add up to 5 floating product images around the content area.

| Setting                            | Example                |
| ---------------------------------- | ---------------------- |
| **Homepage Image Banner Assets 1** | `pillow-product-1.png` |
| **Homepage Image Banner Assets 2** | `pillow-product-2.png` |
| **Homepage Image Banner Assets 3** | `pillow-product-3.png` |
| **Homepage Image Banner Assets 4** | `pillow-product-4.png` |
| **Homepage Image Banner Assets 5** | `pillow-product-5.png` |

Image Guidelines

* Format: PNG with transparent background (recommended)
* Dimensions: 200-400px (varied sizes for visual interest)
* File Size: Under 100KB each
* Style: Product cutouts or lifestyle images

{% hint style="info" %}
When you are happy with your changes, don't forget click **Save** and **Publish** to repackage the edited theme.
{% endhint %}
