> For the complete documentation index, see [llms.txt](https://bogos-guideline.gitbook.io/user-guide/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://bogos-guideline.gitbook.io/user-guide/detailed-guide/customize/customize-cart-message.md).

# Customize Cart message

{% embed url="<https://www.youtube.com/watch?v=EozMJe_kw1U>" %}

## 1. How to enable the cart message <a href="#how-to-enable-the-cart-message" id="how-to-enable-the-cart-message"></a>

To enable and edit the content of the cart message, please navigate to each offer. Each offer will have a different message; when there are multiple messages, they will take turns showing one at a time.

<figure><img src="https://bogos-guideline.gitbook.io/~gitbook/image?url=https%3A%2F%2F1174860429-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252FBQEzvXIQmpPrTmxjT8T6%252Fuploads%252FJf6l2vA1kTDlCke0wXrR%252FCMM.jpg%3Falt%3Dmedia%26token%3Defaa8f0a-4032-4546-9094-dde0c210d513&#x26;width=768&#x26;dpr=4&#x26;quality=100&#x26;sign=1389ab1&#x26;sv=1" alt=""><figcaption></figcaption></figure>

Here is an example of how it looks like on your storefront:

<figure><img src="https://bogos-guideline.gitbook.io/~gitbook/image?url=https%3A%2F%2F1174860429-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252FBQEzvXIQmpPrTmxjT8T6%252Fuploads%252FGqGakNfEen1mH8A16UN5%252Fcartmessage.png%3Falt%3Dmedia%26token%3Dcdc7404c-93d1-425d-bf18-19f4c964c5ae&#x26;width=768&#x26;dpr=4&#x26;quality=100&#x26;sign=104eb58&#x26;sv=1" alt=""><figcaption></figcaption></figure>

## 2. Customization options <a href="#customization-options" id="customization-options"></a>

Aside from the content of the cart message, you can adjust its appearance on the Customization page.

1. Enable **Show on cart page** to let the message shows on the cart page
2. Customize the color: BOGOS allows you to customize the colors of all elements with any of the 3 methods below:

* **Manually adjust** each color field for all the available colors.
* Use [AI Theme Detector](#ai-theme-detector) to auto-generate a full widget color palette based on your store's branding.
* **Contact the BOGOS support team** to get help with color customization.

Click **Save** when done.

#### AI Theme Detector

BOGOS AI scans your online store and detects your brand's primary, secondary, and text colors, then generates a full widget color palette automatically.

{% hint style="warning" %}
Your store must NOT be password-protected for AI to access and detect your brand colors.
{% endhint %}

To edit the colors with BOGOS AI:

1. Click the **pen icon**.

![](/files/8HMgW0p6Hvadbsq4mpf0)

2. Click **Scan again** to let BOGOS AI re-detect, or **manually adjust** the Primary color, Secondary color, or Text fields.

![](/files/wr4WVSAsv8yHcB3JKixf)

3. Click **Apply** for preview to apply the colors to the widget preview.

## Countdown message <a href="#countdown-message" id="countdown-message"></a>

If you want to have a "countdown message" on the cart page, for example: Spend $xx more to get gift, you can try formatting the cart message this way (as the Cart message is HTML supported)

> Spend {{sca\_min\_total\_with\_currency}} more to get FREE GIFT&#x20;
>
> Spend {{sca\_min\_quantity}} more to get FREE GIFT