Chapter 2:

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 begin with, Sign up on CookieYes for free.
• Then, complete the steps in How to Create a Cookie banner.

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.

• 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.

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

1. From the left panel, choose Triggers > +CREATE NEW TRIGGER.
   
   
2. 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

1. From the left panel of your Matomo account, select Tags > Click the Tag name that needs to be fired.
2. Choose the custom event trigger that you have created in Step 2 from the dropdown list. (here, we’ve named the trigger “Analytics”).

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.

Still, have questions or facing issues? Contact technical support