Shopify
CookieBoss works with any Shopify theme. Paste a single script tag into your theme’s <head> and your consent banner is live.
Step 1: Create a CookieBoss account
Sign up at cookieboss.io/signup. You can start with the free plan.
Step 2: Add your domain
In the CookieBoss dashboard at app.cookieboss.io, go to Sites → + New Site and enter your Shopify domain (e.g. yourstore.myshopify.com or your custom domain). Click Add Site.
Custom domain vs myshopify.com
If you use a custom domain (e.g. mystore.com), use that as the domain — not yourstore.myshopify.com. The consent script is bound to the domain you enter here.
Step 3: Add the script to your theme
- In your Shopify admin, go to Online Store → Themes
- Find your active theme and click … → Edit code
- In the Layout folder, open
theme.liquid - Paste the following just before the closing
</head>tag:
<script src="https://cdn.cookieboss.io/scripts/YOUR_SITE_ID/consent.js" defer></script> - Replace
YOUR_SITE_IDwith the Site ID from your CookieBoss dashboard (your site → Installation Script) - Click Save
Why theme.liquid?
theme.liquid is loaded on every page of your store, including checkout (for non-Plus stores, checkout is a separate template). Pasting the script here ensures the banner appears across the entire shopping experience.
Step 4: Publish in CookieBoss
Back in the CookieBoss dashboard, go to your site and click Publish. This compiles your consent script with your banner settings, cookie categories, and language translations. The banner will not appear on your Shopify store until you complete this step.
Verify the installation
Open your Shopify store in an incognito/private browser window. The consent banner should appear at the bottom. You can also open the browser console and run:
console.log(window.CookieBoss) If the script loaded correctly, this logs the CookieBoss API object.
Shopify Analytics and Google Consent Mode v2
Shopify’s built-in analytics and Google Analytics integrations don’t fully respect Google Consent Mode v2 by default. CookieBoss injects the GCM v2 default state (denied for all categories) before any Google tags load, then updates the state when visitors consent.
For full GCM v2 compliance:
- In CookieBoss dashboard, ensure Google Consent Mode v2 is enabled (Settings → Integrations)
- In Shopify, install Google Analytics via Online Store → Preferences → Google Analytics (not via custom theme code), so CookieBoss can manage consent for the GA scripts
- Verify in DevTools that
gtag('consent', 'default', { ... })is called before anygtag('config', 'G-...')calls
Shopify Customer Privacy API
Shopify also exposes a Customer Privacy API that integrates with the Shopify Pixels system. CookieBoss does not currently bridge consent state into Shopify’s Customer Privacy API automatically — this is on the roadmap. For now, use the script-tag method above.
Block third-party scripts
For scripts you add to your theme (Custom Liquid, App Embeds, or theme code), change the type attribute to text/plain and add a data-cookieboss-category attribute. CookieBoss will activate them only after the visitor consents to that category.
<!-- This script won't run until the visitor consents to "marketing" -->
<script type="text/plain" data-cookieboss-category="marketing"
src="https://example.com/pixel.js"></script> Supported categories: necessary, functional, analytics, marketing.
Apps with their own pixels (Klaviyo, Facebook, TikTok, etc.)
For apps that inject their own pixels via Shopify App Embeds, you usually cannot rewrite the <script> tag. Two options:
- Use the app’s native consent integration if it offers one (Klaviyo and Meta both have settings for this)
- Use Shopify Customer Privacy banner setting under Settings → Customer privacy → Cookie banner, and rely on Shopify’s gating
CookieBoss is making this seamless on the roadmap via Shopify Pixels API integration.
Checkout pages (Shopify Plus only)
If you are on Shopify Plus and your checkout is on a separate domain or template, paste the same script tag into the checkout template’s <head> as well. Non-Plus stores share theme.liquid for the storefront and a Shopify-managed checkout that you cannot edit — the consent banner appears on the storefront but not the Shopify-hosted checkout.
Content Security Policy (CSP)
Shopify manages CSP for *.myshopify.com and most custom domains automatically. The cdn.cookieboss.io and a.cookieboss.io domains are not on Shopify’s blocklist, so the script loads without CSP changes.
If you’ve set a stricter custom CSP via Shopify Plus or a third-party app, add:
| Directive | Domain | Purpose |
|---|---|---|
script-src | cdn.cookieboss.io | Loads the consent script |
connect-src | a.cookieboss.io | Sends consent analytics |
Troubleshooting
Banner not showing
- Check that you clicked Publish in the CookieBoss dashboard. The script returns 404 until the site is published.
- Make sure the script tag is in
theme.liquid, inside the<head>element — not in the<body>. - Open an incognito window. If you already dismissed the banner, your consent is stored in a cookie.
Banner shows on storefront but not on checkout
- Non-Plus stores cannot edit the checkout template. The banner only shows on the storefront. This is a Shopify platform limitation.
- Shopify Plus stores: paste the script tag into the checkout template as well.
Banner flashes or loads after page render
- Make sure the script tag is in
<head>, not<body>. - Make sure
deferis present on the<script>tag.
Conflict with Shopify’s built-in cookie banner
- Go to Shopify admin → Settings → Customer privacy → Cookie banner and turn off the built-in banner. CookieBoss replaces it with a more configurable, GDPR-aligned banner.