> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://help.qikify.com/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# Custom Banner


1. **General settings**
![](https://storage.crisp.chat/users/helpdesk/website/-/3/3/f/6/33f605886cba4e00/image_189q1fo.png)

![](https://storage.crisp.chat/users/helpdesk/website/-/3/3/f/6/33f605886cba4e00/image_1ob9pm5.png)
* **Banner Style**: Choose style and color for the banner.

* **Title:** Enter your content here to announce customer about their cart. The title will be bold and different from Message content.

* **Message**: This label is not required. You can add your message or leave it blank.

* **Enable close button**: Enable this option so that your customers can close the banner.

* **Enable collapse button:** This option will be only available when you add message to the banner. You can enable this button to collapse the message by default.


Some **preformatted content** you can use in banner's Message:

* **Bold text:** `text`

![](https://storage.crisp.chat/users/helpdesk/website/33f605886cba4e00/image_80dhly.png)
* **Hyperlink:** `[text](link)`

![](https://storage.crisp.chat/users/helpdesk/website/33f605886cba4e00/image_zzov8z.png)
* **Break line:** `[nl]`

![](https://storage.crisp.chat/users/helpdesk/website/33f605886cba4e00/image_16qa547.png)
* **List of items with bullet:**
[list]
[item] Item 1 [/item]
[item] Item 2[/item]
[/list]

![](https://storage.crisp.chat/users/helpdesk/website/33f605886cba4e00/image_kgstel.png)

### **Dynamic text (product & variant variables) — NEW**

You can insert `{product.title}` - `{variant.title}` into the banner **Title** or **Message**. They are automatically replaced with the real product information from your customer's cart when the banner is displayed at checkout.

This is useful for urgency or personalized messages, for example:

High demand: `{product.title}` - `{variant.title}` is currently selling fast.

which a customer would see as:

High demand: Comfort Sandal - Black / Large is currently selling fast.

![](https://storage.crisp.chat/users/helpdesk/website/-/3/3/f/6/33f605886cba4e00/image_4cs7yy.png)

### Available variables
| Variable | Shows | Example output |
| `{product.title}` | Product name | Comfort Sandal |
| `{variant.title}` | Variant name | Black / Large |
| `{variant.sku}` | Variant SKU | SKU-1234 |
| `{product.vendor}` | Vendor / brand name | Medi Komfort |
| `{product.type}` | Product type | Shoes |
| `{customerId}` | Customer ID | 1234567890 |

###### 
|| All product and variant variables read the first item in the cart. If your customer has several products in their cart, the banner always shows information from the first line. You can also check the Preview section in the banner settings to see how your text will look with sample values before saving.


2. **Display conditions**

You can show the banner with specific conditions, such as Product, Cart total, Customer tags, etc.
The Custom Banner will only show up if it meets **all conditions (All rules pass)** or **one of the conditions (Any rule passes)**.

![](https://storage.crisp.chat/users/helpdesk/website/33f605886cba4e00/image_1b9to3q.png)
You can also manage to hide the banner on **Checkout Draft Order** or **Online store** by choosing those options in the **Display sales channel **settings.

3. **Advance settings**

In this section, you can schedule to show the Custom Banner with specific timeline or only display the Custom Banner every day of a week with **Repeat option**

![](https://storage.crisp.chat/users/helpdesk/website/33f605886cba4e00/image_1g2gnd.png)

4. **Preview**

Before previewing the Custom Banner, you will need to add it to your Checkout page in Checkout editor. Please go to the your theme customization and follow our steps to add Custom Banner.

* **Step 1:** After creating a banner, you will see the **Banner ID**. Please copy it.

![](https://storage.crisp.chat/users/helpdesk/website/33f605886cba4e00/image_lbr0lk.png)
* **Step 2:** Go to the **Checkout page settings** > Choose **Add app block** > Select **Extra Widget**.

![](https://storage.crisp.chat/users/helpdesk/website/33f605886cba4e00/image_twsiea.png)
* **Step 3: **Choose **Custom Banner** in **Extra widget** **type** option and type the Banner ID (optional).
You can also remove this feature by clicking on the bin icon when clicking on the widget and change the position of this Reward Bar by holding the item and dragging it to the place you want.

![](https://storage.crisp.chat/users/helpdesk/website/33f605886cba4e00/image_xki8re.png)

| If you have only one Custom Banner, you don't have to fill the Entry ID. Our app will auto show the Custom Banner once the condition is reached.
| In case you have multiple Custom Banners and want to show multiple banners or display each bar in different positions, please kindly type the banner ID to the Entry ID label. You can find the banner ID at the preview section in Custom Banner settings.
|| If you need any assistance with this feature, please contact our support team or reach out through the live chat in the app portal.