> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://support.consentmo.com/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# Hydrogen Integration

For Shopify Hydrogen users, integrating a robust cookie consent tool is now seamless and effective with Consentmo GDPR. 

Consentmo GDPR is offering a tailored solution for Hydrogen-based stores that can be set as per the guide below.

# How to enable it

The Hydrogen integration from our app can be enabled by following these steps: 

1. Open the **Integrations** tab

2. Go to the **Hydrogen (headless)** section

3. Make sure to **toggle ON** the feature

[![](https://gdprstorage.b-cdn.net/faq/gif/hydrogen-enable.gif)](https://gdprstorage.b-cdn.net/faq/gif/hydrogen-enable.gif)

This action unlocks detailed instructions on proceeding with the integration. 

Keeping the toggle active also ensures that your store benefits from the latest updates from Consentmo, guaranteeing a smooth operation with your Hydrogen setup.

|| It’s important to note that this integration feature is exclusive to Enterprise plan users of Consentmo GDPR. This exclusivity brings advanced capabilities and dedicated support, ensuring your store's compliance is top-notch.

# Setup the Customer Privacy API using the npm package providded by our app:

1. **Install the npm package**: Use [@consentmo/consentmo-hydrogen](https://www.npmjs.com/package/@consentmo/consentmo-hydrogen) in your **Hydrogen project.**

It needs to be **installed **by **running the following** command: **npm i @consentmo/consentmo-hydrogen**


|| Note: This package will automatically modify app/root.jsx and app/entry.server.jsx. Backup these files before installation.

2. **Configure Your Store’s Domain:** Update the **CookieBar component in app/root.jsx.** >> [View how](https://gdprstorage.b-cdn.net/gifs/hydrogen-integration-store-setup.gif) <<

3. **Example Repository:** Check our [demo project](https://github.com/ShopifyAdminTest/consentmo-cookie-bar/commit/796c7c5e6925c9e9a7ec6c3e38cb10673d1a34d9) for reference.

|| Note for Older Versions: If using Hydrogen version older than 2024.4.3, include the [Customer Privacy JavaScript asset](https://cdn.shopify.com/shopifycloud/consent-tracking-api/v0.1/consent-tracking-api.js) in your store’s **<head>**.

# Setup the Customer Privacy API integration

Once the Customer Privacy API is set correctly as per the previous steps now it needs to be integrated with the app. 

1. **Configure Checkout Domain:** Follow Shopify’s [3-step guide](https://shopify.dev/docs/storefronts/headless/hydrogen/analytics/consent#configure-your-hydrogen-checkout-domain).

2. **Complete Settings:** Fill in the fields shown below.

![](https://storage.crisp.chat/users/helpdesk/website/-/b/0/7/f/b07f7406951a4000/hydrogen-fields_mwsch6.png)
For the **Storefront access token in the app** settings use the **Public access token from the Hydrogen project.** 

It can be found once you **access the project > Storefront settings > Storefront API > Public access token** field, as shown below:

[![](https://gdprstorage.b-cdn.net/faq/gif/hydrogen-API-key.gif)](https://gdprstorage.b-cdn.net/faq/gif/hydrogen-API-key.gif)
# Need help?

In case you need any assistance, please make sure to reach out to our support team via live chat or at support@consentmo.com