Getting Started

Help Guides > Getting Started > Installation Guides > How to Add Cookie Banner in Matomo

How to Add Cookie Banner in Matomo

Welcome to CookieYes! This guide will walk you through how you can install a cookie banner on websites using Matomo Tag Manager. A cookie banner will help your website stay compliant with privacy laws like the GDPR and ePrivacy Directive.

To Connect Matomo and CookieYes

Step 1. Navigate to Tag Manager. 

From the Top Navigation Panel of your Matomo Account, click Tag Manager.

Step 2. Create a New Tag.

  1. From the left panel, choose Tags > +CREATE NEW TAG.
  2. Under Choose a type of tag to continue, select Custom HTML from the list of options.

Step 3. Configure the Tag.

Enter the following fields:

  • Name – Name the Tag ( here, we’ve named it ‘CookieYes CMP’).
  • Configure what this tag should do – Here, you should insert the CookieYes Installation code.
Note:

To get the cookie banner installation code, refer to our guide.

  • Position – Choose Head Start from the dropdown list.
  • Configure when the tag should do this – Choose Page View trigger from the dropdown list.

Your Tag Configuration will be similar to this:

Click the CREATE NEW TAG button.

Step 4. Publish a new version to apply the changes.

Select Publish from the left panel. Name the version and then click Create new version and publish release.

Note:

Make sure you’ve added the Matomo Tag Manager script inside the head tag immediately after opening of the <head> tag of your website.

Now, your cookie consent banner is live on your website. To complete the integration of Matomo and CookieYes, refer to the step-by-step instructions below.

Step 1. Add this code to the header of your website just below the Matomo Tag Manager script. This ensures that your Matomo Tags function only after consent is given to CookieYes.

<script>
  document.addEventListener("cookieyes_consent_update", function (eventData)
 {
   const data = eventData.detail;
   if (data.accepted.includes("analytics")) {
     _mtm.push({"event": "analytics-yes"});
    }
  });
  </script>

Here, we’ve used the Analytics Category.

Step 2. Create a New Custom Trigger

  • From the left panel, choose Triggers > +CREATE NEW TRIGGER.
  • Under Choose a type of trigger to continue, choose Custom Event from the list of options.

Step 3. Configure the Event Trigger.

Name the Trigger as per your choice. In the Event Name text box, enter the name of the event for which you need to retrieve the value. E.g. analytics-yes

Click on CREATE NEW TRIGGER to save.

Step 4. Add the custom event trigger to the required custom HTML Tag

From the left panel of your Matomo account, select Tags > Click the Tag name that needs to be fired.

Choose the custom event trigger that you have created in Step 2 from the dropdown list. (here, we’ve named the trigger “Analytics”).

Note:

Once you’ve added a tag or trigger, ensure to publish a new version to apply your changes.

Similarly, you can configure other tags based on their respective categories, such as Functional, Advertisement etc.

Step 5: Verify Integration.

To check if CookieYes and Matomo are working together, visit your website and ensure that the CookieYes Cookie Consent Banner is visible and cookies are blocked. You can also explore more options and features from the CookieYes Dashboard.

See Also

Still have questions or facing issues? Contact technical support

Next chapter:Complete website scanning

Was this article helpful?