# Customizing the Compliance UI

***

### All Customization Options at a Glance

#### Main CrushSuite App Embed

| Setting                    | Options                                        |
| -------------------------- | ---------------------------------------------- |
| Shipping button visibility | On / Off                                       |
| Shipping button color      | Any hex color                                  |
| Shipping button position   | Top Left, Top Right, Bottom Left, Bottom Right |

#### Entry Pop-Up Modal Embed

| Setting          | Options         |
| ---------------- | --------------- |
| Title text       | Custom text     |
| Subtitle text    | Custom text     |
| Logo image       | Upload your own |
| Description text | Custom text     |

#### Product Page Compliance Details Embed

| Setting                        | Options                                                   |
| ------------------------------ | --------------------------------------------------------- |
| Cannot purchase message        | Custom text                                               |
| Show available shipping states | On / Off                                                  |
| States list position           | Under Add to Cart, Under main section, Above main section |

#### Collection Page Compliance Settings Embed

| Setting                 | Options                                         |
| ----------------------- | ----------------------------------------------- |
| Cannot purchase message | Custom text                                     |
| Indicator color         | Any hex color                                   |
| Indicator size          | Adjustable                                      |
| Indicator position      | Top Left/Center/Right, Bottom Left/Center/Right |

***

### Branding Tips

#### Keep It Consistent

Use the same color for the shipping button and collection page indicators. Customers learn to associate that color with compliance information across your store.

#### Write Helpful Messages

The default "cannot purchase" messages work, but custom messages that reference your brand build more trust:

* **Generic:** "Shipping unavailable to your state."
* **Better:** "Due to state regulations, we're unable to ship this wine to \[state]. View our \[shipping info] page for details."

#### Match Your Theme

If your theme uses dark colors, choose lighter badge colors for contrast (and vice versa). The compliance UI should complement your design, not compete with it.

#### Test on Mobile

All CrushSuite embeds are responsive, but always preview on mobile to ensure the shipping button, entry modal, and compliance badges look good on smaller screens. Use the Shopify customizer's mobile preview mode.

***

### How to Access All Embed Settings

All four embeds are managed from the same place:

1. **Shopify Admin** → **Online Store** → **Themes** → **Customize**
2. Click the **App Embeds icon** (third icon, left sidebar)
3. Each CrushSuite embed is listed — click to expand and customize

***

### Need More Help?

If you're having trouble with embed customization or the compliance UI isn't displaying as expected, [contact our support team](https://crushsuite.com/contact) — we're here to help.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://crushsuite.gitbook.io/docs/compliance/storefront-and-checkout/customizing-the-compliance-ui.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.