All Collections
Website Builder
Connect to Cookiebot
Connect to Cookiebot
Updated over a week ago

This is a guide for how to connect Cookiebot to your website builder in order to add the cookie consent banner to your website. This allows you to comply with the General Data Protection Regulation (GDPR) rules governing cookie consent.

Before connecting Cookiebot:

  • Please ensure you have read: Add a cookie consent banner to your website builder to comply with GDPR.

  • Understand that the GDPR is a set of data protection laws that apply to European Union (EU) citizens and residents. If you have guests visiting your page and booking from this region, you will be required to comply with the GDPR. It is likely that your website can be accessed by members of these countries , so we strongly advise you to follow this guide.

Step 1: Set up your Cookiebot account

  1. Create a free Cookiebot account, or log in if you already have an account.

  2. Add the Domain name of your website.

    The domain name is the unique part of a URL that identifies your website. For example, in the following URL, the domain name is “yourdomainname”:
    https://www.yourdomainname.com.au/page

    Adding your domain name in the Cookiebot platform.
  3. In the Your scripts tab, take note of the Domain Group ID. You are going to need it in the next steps.

    The Domain Group ID in the Your Scripts tab of the Cookiebot platform.

Once Cookiebot is set up, you may want to explore its Content and Widget settings.

Step 2: Set up your Google Tag Manager (GTM) account

  1. Create a free Google Tag Manager (GTM) account, or log in if you already have an account.

  2. Choose Web as the Target platform and enter your account details.

  3. Enter your website’s domain name in the Container name. This is the same as the Domain name you entered into Cookiebot.

  4. Click on Create and make sure to read and accept the Terms and Conditions.

Adding a new account in Google Tag Manager by entering the Account Name, Container Name, and Target platform.

Step 3: Set up the cookie consent banner in your Google Tag Manager

In the Google Tag Manager platform, you will need to:

  • Add Cookiebot CMP in Templates

  • Add Cookiebot CMP to your Tags

  • Define the Default consent state

3.1) Add Cookiebot CMP in Templates

  1. In your Google Tag Manager platform, go to Templates > Tag templates > Search gallery.

  2. Search for Cookiebot CMP in the list of community tag templates.

  3. Click on Add to workspace and confirm by clicking on Add.

    In the Google Tag Manager Template Editor, adding the Cookiebot CMP community tag template.

3.2) Add Cookiebot CMP to your Tags

  1. Create a new tag in your Google Tag Manager container by going to Tags > New > Tag configuration.

  2. From the list of standard tag types, select Cookiebot CMP.

  3. In the Cookiebot ID field, enter the Domain Group ID found on your Cookiebot platform under the Your Scripts tab (refer back to Step 1 ).

  4. Choose the Consent initialization - All pages trigger.

  5. Apply a name to your tag at the top of the configuration page. E.g. “Cookiebot”.

  6. Click on Save to create the tag.

    Adding the Cookiebot CMP tag through the Tag configuration page in Google Tag Manager.

3.3) Define the Default consent state

  1. In the Tag Configuration, click on the Default consent state section to expand it.

  2. Google Tag Manager provides five default consent checks, and these are mapped automatically to the four categories used by Cookiebot CMP :

    1. ad_storage: enables cookies related to advertising. Mapped to Cookiebot type: marketing.

    2. analytics_storage: enables cookies related to analytics (e.g. visit duration). Mapped to Cookiebot type: statistics.

    3. functionality_storage: enables cookies that support the functionality of the website or app (e.g. language settings). Mapped to Cookiebot type: preferences.

    4. personalization_storage : enables cookies related to personalization (e.g. video recommendations). Mapped to Cookiebot type: preferences.

    5. security_storage: enables cookies related to security such as authentication functionality, fraud prevention, and other security protections. Mapped to Cookiebot type: necessary.
      💡 In line with the GDPR, the category security_storage is set to Allow by default and it is not configurable. This type doesn’t require consent from the end user, but they will be informed of this in the consent banner.

  3. Adjust which categories of cookies should be granted or denied before the end user submits consent.

    An example of the Default consent state configuration where the Preferences, Statistics, and Marketing cookies are all set to 'Denied'.

Step 4: Add additional consent checks in your Google Tag Manager

💡 This step is necessary for tags that don’t contain any built-in consent checks, or if you want to add additional consent checks to tags. Otherwise, you can skip to the next step.

  1. In your Google Tag Manager platform, go to Tags > New > Trigger Configuration.

  2. Fill in the following fields:

    • Trigger Type : select Custom event

    • Event Name : enter “cookie_consent_update”

    • This trigger fires on : select All custom events

      In the Trigger configuration, adding 'cookie_consent_update' to the 'Event name' field.
      In the Trigger configuration, configuring: Consent settings > Additional consent checks to 'Require additional consent for tag to fire' and then entering 'ad_storage' into this field.

  3. Update any tags to replace the existing trigger (e.g. All Pages ) with the new trigger you have created.

    An existing tag (e.g. Facebook Pixel) which has been updated to have the 'Consent Update' as its 'Firing Trigger'.

💡 To view of the consent settings across all the tags in your container, you can enable the from the Google Tag Manager settings.


Step 5: Set up Google Tag Manager as a widget in your website builder

  1. In your Google Tag Manager platform, follow these instructions to install Google Tag Manager on a webpage by copying some code into your website.

  2. In your website builder, go to the Advanced settings page > Third-party widget tab.

  3. Paste the code you copied from Google Tag Manager.

    Pasting the code from Google Tag Manager into the website builder's 'Third-party widget' tab.
  4. Click on Save , but don’t publish yet!

⚠️ To ensure compliance with GDPR, your Third-party widget page must contain only the Google Tag Manager code and nothing else. To add additional scripts to your site, you must add them as a tag using Google Tag Manager. : Create a custom tag.


Step 6: Add a Cookie declaration in your website builder

In your website builder, you will need to:

6.1) Create a Cookie declaration page in your website builder

  1. In your website builder, go to Website pages.

  2. At the bottom of the left panel, on the Enter page name field, type “Cookie Declaration” and click on Add.

  3. Click on its ellipsis button (...) > Hide. This will ensure the Cookie declaration page doesn’t show in the main navigation of your website, because we will be adding it to the footer instead.

    Clicking 'Hide' on the new 'Cookie declaration' page created.
  4. In the new Cookie declaration page you have just created, scroll down and click on Add HTML Section.

    Clicking 'Add HTML Section' within the new 'Cookie declaration' page. Note: Only click once, then scroll back up.
  5. Enter the code below, replacing the DOMAIN_GROUP_ID with the Domain Group ID found on your Cookiebot platform, under the Your Scripts tab.
    <script id="CookieDeclaration" src="https://consent.cookiebot.com/ DOMAIN_GROUP_ID /cd.js" type="text/javascript"></script>

  6. Don’t forget to save your new page.

6.2) Add a Cookie declaration to your website’s footer

  1. In the website builder, go to Manage themes > Footer.

  2. Click on the add ( + ) button on one of the sections of the footer

  3. Select the Cookie Declaration page you just created.

  4. Click on Save. On your website builder’s preview, you will now see the link to the Cookie Declaration page in your website’s footer.

On the Footer Manager page, adding the 'Cookie Declaration' footer.
A preview of the new 'Cookie Declaration' footer displaying on a website.


Step 7: Publish changes to your Google Tag Manager

  1. In your Google Tag Manager platform, click on the Submit button.

    The 'Submit' button in the Google Tag Manager.
  2. Select Publish and create version.

  3. Enter a Version name. This identifies the changes you have made in case you need to undo some changes later. E.g. “Implemented Cookiebot”.

  4. Click on the Publish button.

    The Submit Changes page where 'Version Name' has been entered as 'Implement cookiebot' and 'Version description' has been left blank.


Step 8: Publish changes to your website builder

  1. In your website builder, click on the Publish changes button.

  2. It may take a few minutes before changes appear on your website. Check to ensure the cookie consent banner appears when you open the website for the first time.

Did this answer your question?