Shopify Integration: User Guide for Blutic Cookie Consent App

Welcome to the Blutic Cookie Consent App integration guide! This comprehensive resource is designed for Blutic clients, Shopify merchants, and website visitors who want to seamlessly integrate Blutic's powerful cookie management system with their Shopify store. Blutic ensures privacy regulation compliance by providing a customizable cookie banner that collects user consents, blocks non-essential trackers, and logs events for audits—all while maintaining a smooth user experience on your site.

By integrating the Blutic Cookie Consent App, you'll automate cookie scanning, consent management, and banner deployment across your Shopify store. This guide walks you through every step, from discovery to ongoing maintenance, with detailed explanations, tips, and best practices. Whether you're a first-time user or an experienced merchant, you'll find clear instructions to get up and running quickly.

‍

Estimated Time to Complete Setup: 15-30 minutes  

Requirements:  

- An active Shopify store (any plan).  

- A Blutic account with a valid Site ID or API key (sign up at (Blutic.club) if you don't have one).  

- Admin access to your Shopify dashboard and Blutic admin panel.

Why Integrate Blutic with Shopify?

Before diving in, here's why this integration matters:  

• Compliance Made Easy: Automatically block cookies until consent, reducing fines and legal risks.  

• User Trust: Transparent banners build credibility, improving conversion rates.  

• Seamless Performance: No code changes needed—Blutic handles script injection and updates.  

• Analytics Integration: Works with tools like Google Analytics while respecting consents.  

• Scalability: Automatic updates ensure your setup stays current with evolving regulations.

Now, let's get started with the integration journey.

Step 1: Discover and Install the Blutic Cookie Consent App

Your integration begins in the Shopify App Store, where thousands of merchants have already streamlined their privacy setup.

1. Log in to Your Shopify Admin Dashboard:  

  Open your browser and navigate to [admin.shopify.com](https://admin.shopify.com). Sign in with your Shopify credentials. This is your central hub for managing your store, apps, and settings.

2. Access the Shopify App Store:

  From the left sidebar, click Apps > Shopify App Store. This opens a searchable marketplace of vetted apps to enhance your store.

3. Search for the App:  

  In the search bar, type "Blutic Cookie Consent" and hit Enter. The app should appear prominently—look for the official Blutic logo and description highlighting GDPR/CCPA compliance, customizable banners, and easy setup.

4. Review and Install:

  Click on the app listing to view details, including user reviews, pricing (free trial available), and features like auto-script injection. If it aligns with your needs, click Add app (or Install if prompted). Shopify will ask for permissions—review them (e.g., access to store data for consent logging) and confirm by clicking Install app.  

5. Confirmation:

  You'll be redirected to the app's dashboard within Shopify. A success message will confirm installation. If you see any errors (e.g., network issues), refresh the page or reinstall.

At this point, the app is embedded in your Shopify ecosystem but not yet connected to your Blutic account. No scripts are live yet—your store remains unchanged.

Step 2: Authenticate the App with Your Blutic Credentials

To link your Shopify store to Blutic's backend, you'll provide secure credentials. This one-time step validates your account and enables data sync.

1. Open the App Dashboard:

  From your Shopify admin, go to Apps> Blutic Cookie Consent This loads the app's interface, a clean dashboard with tabs for Setup, Customization, Logs, and Support.

2. Locate the Authentication Section:

  On the Setup tab (default view), you'll see a prominent "Connect to Blutic" panel. It explains the benefits and includes fields for your credentials.

3. Enter Your Blutic Site ID or API Key:  

  - Site ID: This is your unique Blutic project identifier (found in your Blutic dashboard under Settings > General > Site ID). It's ideal for single-site setups.  

  - API Key: Use this for advanced users or multi-site management (generate it in Blutic under Settings > API > Generate Key). Copy-paste it directly.  

Security Note: Never share these publicly. Blutic uses encrypted transmission (HTTPS) for all data.

4. Validate and Connect:

  Click Authenticate, the app sends a secure request to Blutic's servers. You'll see a loading spinner for 5-10 seconds.  

  -Success: A green checkmark appears, with a message like "Connected! Your store [Store Name] is now linked to Blutic Site ID [ID]." The dashboard updates to show your connected account details.  

  - Error Handling: If validation fails (e.g., invalid key), an error message specifies the issue (e.g., "Invalid Site ID—check formatting"). Double-check your input, regenerate the key if needed, and retry. Common fixes: Ensure no extra spaces; confirm your Blutic account is active.

Your store is now authenticated—Blutic can push configurations and pull consent data.

Step 3: Validate Credentials and Connect the Store

Behind the scenes, authentication triggers validation, but let's ensure everything syncs smoothly.

1. Monitor Validation in Blutic Dashboard:

  Log in to your Blutic admin at [dashboard.blutic.com](https://dashboard.blutic.com). Navigate to Integrations > Shopify. You should see your store listed as "Connected" with a green status. If not, refresh or check for pending approvals.

2. Sync Initial Data:

  In the Shopify app dashboard, click Sync Now under the Setup tab. This pulls your Blutic banner template, cookie categories (e.g., Essential, Marketing), and default settings. Expect a 1-2 minute process.  

3. Confirm Connection:

  Review the connection summary: It shows linked domain, sync status, and estimated compliance score (e.g., 100% if all categories are set). If issues arise (e.g., domain mismatch), edit your Blutic site settings to match your Shopify URL (e.g., mystore.myshopify.com).

Your platforms are now bridged—consents from Shopify will flow to Blutic for centralized management.

Step 4: Customize the Cookie Banner

Tailor the banner to match your brand and user needs. All changes are previewed live.

1. Access Customization Tools:

  In the Shopify app dashboard, switch to the Customization tab. This mirrors Blutic's styling options but is Shopify-optimized for quick edits.

2. Appearance Settings:

  - Colors and Fonts: Select primary/secondary colors (e.g., match your theme's hex codes), fonts (Google Fonts integration), and button styles (e.g., rounded edges). Use the color picker or input HEX values.  

  - Logo and Branding:Upload your logo (PNG/SVG, <500KB) and set positioning (top-left, center). Enable/disable brand name display.  

  Preview Tip: A live preview pane shows changes in real-time—toggle desktop/mobile views.

3. Language and Content:  

 - Languages: Add support for multiple languages (e.g., English, German) via Blutic's 50+ templates. Select defaults and enable auto-detection based on browser locale.  

  - Text Editing: Customize banner text (e.g., "We respect your privacy—manage your cookies"), button labels ("Accept All," "Reject Non-Essential," "Settings"), and legal links (Privacy Policy, Terms). Use the WYSIWYG editor for formatting.  

 - Compliance Tweaks: Add region-specific elements like CCPA "Do Not Sell" toggles or GDPR withdrawal options.

4. Behavior and Layout:

  - Banner Type: Choose overlay, footer, or popup; set animation (fade-in, slide-up).  

  - Blocking Logic: Define geoblocking (e.g., show only in EU) and auto-revoke (e.g., after 6 months).  

  - Advanced: Integrate with Shopify themes—select "Auto-Adapt" for responsive design.

5. Save and Apply:

  Click Save Changes. The app pushes updates to Blutic, which syncs back in under 30 seconds. Test by clicking Preview on Store—it opens your live site with the draft banner.

Customization ensures the banner feels native to your store, boosting acceptance rates.

Step 5: Automatic Script Injection and Banner Deployment

No manual coding—Blutic handles deployment via Shopify's API.

1. Enable Injection:

  In the Setup tab, toggle Deploy Banner to ON. This authorizes the app to use Shopify's ScriptTag API.

2. What Happens Automatically:

  - The app creates and injects a lightweight <script> tag into your store's <head> (site-wide, including checkout if enabled).  

  - Script URL: Hosted on Blutic's CDN for speed (e.g., cdn.blutic.com/script.js?site=[ID]).  

  - Blocking: Non-essential scripts (e.g., ads, analytics) are paused until consent via Blutic's tag manager.

3. Verify Deployment:

  Visit your live store (e.g., mystore.com) in an incognito browser. The banner should appear on load, overlaying content until interaction. Check browser console (F12 > Console) for "Blutic CMP Loaded" message—no errors means success.

4. Edge Cases:

  If using custom themes, ensure no conflicts (e.g., disable conflicting apps). Re-inject via  

Re-deploy Script button if needed.

Your banner is now live, protecting visitors from day one.

Step 6: Banner Functionality and User Interaction

Once deployed, the banner engages users transparently.

1. On-Site Behavior:

  Initial Load: Banner displays, categorizing cookies (Essential always on; others opt-in).  

  User Actions: "Accept All" enables everything; "Settings" opens granular toggles; "Reject" blocks trackers. Revoke anytime via footer link.

2. Testing Consents:

  Use the app's Test Mode (toggle in dashboard) to simulate users without affecting real data. Track via preview tools.

3. Mobile Optimization:

  Responsive by default—test on devices to confirm touch-friendly buttons.

Step 7: Capture and Log Consent Events

Compliance requires proof—Blutic logs everything.

1. Event Logging:

  Every consent (accept/reject/update) is timestamped, IP-anonymized, and stored in Blutic's secure database. Shopify app syncs via webhooks.

2.Access Logs:

  In Blutic dashboard > Reports > Consents, view/export CSVs. Filter by date, action, or user. Shopify app shows a summary dashboard.

3. Audit Trail  

  Logs include device/browser details for full traceability.

Start your free Blutic trial today and elevate your store's privacy game.