> For the complete documentation index, see [llms.txt](https://crushsuite.gitbook.io/docs/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://crushsuite.gitbook.io/docs/compliance/getting-started/setting-up-your-app-embeds.md).

# Setting Up Your App Embeds

App embeds are how CrushSuite's compliance features appear on your storefront. They control the age verification modal, the shipping state selector, product-level compliance badges, and collection-lev

### What Are App Embeds?

App embeds are Shopify theme extensions that inject CrushSuite's compliance UI into your existing theme. They don't replace your theme — they add compliance functionality on top of it. You enable and customize them through Shopify's theme customizer.

CrushSuite includes these app embeds:

<table><thead><tr><th width="162.5234375">Embed</th><th width="220.67578125">What It Does</th><th>Required?</th></tr></thead><tbody><tr><td><strong>Main CrushSuite App</strong></td><td>Core compliance engine + shipping state selector</td><td><strong>Yes — required</strong></td></tr><tr><td><strong>Entry Pop-Up Modal</strong></td><td>Age verification + state selection on first visit</td><td>Recommended</td></tr><tr><td><strong>Product Page Compliance Details</strong></td><td>Shows shipping availability on product pages</td><td>Recommended</td></tr><tr><td><strong>Collection Page Compliance Settings</strong></td><td>Shows compliance indicators on collection pages</td><td>Recommended</td></tr><tr><td><strong>Cart / Compliance Form</strong></td><td>Powers the pre-checkout compliance form (age, billing, shipping) and its appearance, copy, and bypass settings</td><td><strong>Yes — required for checkout</strong></td></tr></tbody></table>

Each embed has its own detailed configuration guide in the Storefront & Checkout section. This page gives you the quick setup to get all four enabled during onboarding.

***

### How to Enable App Embeds

1. In your **Shopify Admin**, click **Online Store** in the left sidebar.
2. Click **Themes**, then click **Customize** on your active theme.
3. In the theme customizer, click the **App Embeds icon** — it's the third icon on the left-side navigation bar (looks like a puzzle piece or plug icon).
4. You'll see CrushSuite's embeds listed. Enable each one:
   * **CS Main** — Toggle **on** (this is mandatory)
   * **CS Entry Modal** — Toggle **on**
   * **CS Product Page** — Toggle **on**
   * **CS Collection** — Toggle **on**
   * **CS 5. Cart** — Toggle **on** (powers the compliance form; **Enable pre-checkout compliance check** is on by default inside its settings)
5. Click **Save**.

{% hint style="warning" %}
**The Main CrushSuite App embed must be turned on.** If this embed is disabled, CrushSuite's compliance features will not function on your storefront — customers won't see compliance checks, state selectors, or availability restrictions.
{% endhint %}

<figure><img src="https://3906158595-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FagSKdREExJMSW7WgxBLr%2Fuploads%2FSOQzPgcod1XrbZYFBcRY%2FCleanShot%202026-03-12%20at%2014.01.42.png?alt=media&amp;token=b264ff41-5c3e-45f7-9d8a-740bc5a717de" alt=""><figcaption></figcaption></figure>

***

### Quick Customization

Each embed has customization options (colors, text, positioning) that you can adjust right in the theme customizer. For now, the defaults work well for most stores. When you're ready to fine-tune, see the detailed guides:

* Main CrushSuite App Embed
* Entry Pop-Up Modal Embed
* Product Page Compliance Details Embed
* Collection Page Compliance Settings Embed
* Pre-Checkout Compliance Form — see *Customizing the Compliance UI* for display style, branding, copy, and bypass options
