> For the complete documentation index, see [llms.txt](https://foxecom.gitbook.io/zest-theme/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://foxecom.gitbook.io/zest-theme/theme-sections/promotion-banner.md).

# Promotion banner

<figure><img src="/files/ntsOj9aVx3mAskmrBrGM" alt=""><figcaption></figcaption></figure>

{% hint style="info" %}
This section is available in ✨ **Zest version 9.0.0 and later**. See our [Changelog](/zest-theme/changelog.md)
{% endhint %}

Create bold, eye-catching announcements to highlight offers, seasonal campaigns, or storewide events with the **Promotion Banner** section. With flexible layouts and high-impact typography, this section is perfect for capturing customer attention and driving conversions.

## How to add a Promotion banner **section** to your Shopify store <a href="#how-to-add-a-highlight-text-with-image-section-to-your-shopify-store" id="how-to-add-a-highlight-text-with-image-section-to-your-shopify-store"></a>

{% hint style="success" %}
**Steps:**

1. In the theme editor **(Customize)** > click **Add section**
2. Select **Promotion banner**.
3. Make necessary changes.
4. **Save** the settings.
   {% endhint %}

## How to edit a Promotion banner **section** <a href="#how-to-edit-a-highlight-text-with-image-section" id="how-to-edit-a-highlight-text-with-image-section"></a>

### Section settings <a href="#section-settings" id="section-settings"></a>

<table><thead><tr><th width="210">Setting</th><th>Description</th></tr></thead><tbody><tr><td><strong>Container</strong></td><td>Choose between <strong>Fixed width</strong> or <strong>Full width</strong> layout</td></tr><tr><td><strong>Color scheme</strong></td><td>Apply pre-defined color scheme. Learn more: <a data-mention href="/pages/E1dNsgsqbhMsJjy8Hv1S">/pages/E1dNsgsqbhMsJjy8Hv1S</a></td></tr></tbody></table>

### Block settings

Each Promotion Banner can contain **2 text blocks** side by side:

* Each block has its own **heading**, **subheading**, and **body text**.
* Customize typography size, color, alignment, and width per block.
* Use *italics* or **bold** for visual emphasis.
* Insert call-to-action buttons with custom text (e.g. “Shop the Sale”).

<figure><img src="/files/uJfRY1G0hR0sQ3RVRWj0" alt=""><figcaption></figcaption></figure>