Matomo

[sakis-tech]

Hello, I use Matomo and don't know how to link it to the cookieconsent. Can someone help me with an example or something else?

[orestbida]

Hi @sakis-tech,

you need to use matomo's api. You can find an example in https://github.com/orestbida/cookieconsent/discussions/279.

[tailwindtom]

Hello @sakis-tech - in most cases you dont need consent for matomo, as you can host it locally. I added it as a necessary cookie, working in germany.

[sakis-tech]

Hi @sakis-tech,

you need to use matomo's api. You can find an example in #279.

Thank you @orestbida for the tip. That helped me.

I have still one question. Is there a way to combine the Matomo cookies "_pk_id.*" , "_pk_ses.*" and "mtm_consent_removed" in a custom cookie such as "matomo_cookies"?

Hello @sakis-tech - in most cases you dont need consent for matomo, as you can host it locally. I added it as a necessary cookie, working in germany.

Yes, that's right @tailwindtom . But you never know, so I'm on the "safe" side. In Germany there is a saying “It is better to have and not need than to need and not have.” or something like that. :)

[orestbida]

@sakis-tech unless there is a config. option offered by Matomo to do so, I don't think it's possible.

There is however an option to disable all matomo's cookies, but it impacts the analytics' data accuracy.

[sakis-tech]

I understand, all right. then the issue is closed for me. Thank you for the great support.

[sakis-tech]

I have now switched to V3 and unfortunately do not know how to integrate Matomo there. Can you help me with that?

Many Thanks.

[orestbida]

The easiest way is via script tags:

<script type="text/plain" data-category="analytics">
 _paq.push(['setConsentGiven']);
</script>

<script type="text/plain" data-category="!analytics">
 _paq.push(['forgetConsentGiven']);
</script>

or you could configure it the same way as in v2.

cc.run({
    onConsent: () => {
        if(cc.acceptedCategory('analytics')) {
            _paq.push(['setConsentGiven']);
        }
    },

    onChange: () => {
        if(!cc.acceptedCategory('analytics')) {
            _paq.push(['forgetConsentGiven']);
        }
    },
});

Note: cc is a shorthand for CookieConsent.

Update: proper way to handle matomo inside the onChange callback:

onChange: ({ changedCategories }) => {
    if(changedCategories.includes('analytics') {
        if(!cc.acceptedCategory('analytics')) {
            _paq.push(['forgetConsentGiven']);
        } else {
            _paq.push(['setConsentGiven']);
        }
    }
}

Unlike the above version, this allows the user to also opt-in in a later moment.

[tailwindtom]

Hello @sakis-tech - did you add the cookie consent as a plugin? I would recommend to add all scripts (cookieconsent, google tag and so on) as a plugin.

My configuration with Nuxt 3:

Install via npm vanilla-cookieconsent

/plugins/cookieconsent.js

import 'vanilla-cookieconsent';

const config = {
    current_lang: document.documentElement.getAttribute('lang'),
    autoclear_cookies: true, // default: false
    page_scripts: true, // default: false
....
...

export default ({ app, store }, inject) => {
    inject('cookieconsent', () => {
        // obtain plugin
        var cc = initCookieConsent()

        // run plugin with your configuration
        cc.run(config);
    })
  }

in the nuxt config you can add it like this: plugins: [ '~/plugins/cookieconsent.js' ]

finally, you can add it to your mounted functions in app.vue:

mounted() {
            window.addEventListener("scroll", this.handleScroll);
            document.documentElement.classList.add('dark')
            this.$cookieconsent()

        },

i added this comment because in some cases, the cookie consent does not load all the time if you add it as a static script.

[sakis-tech]

thanks everyone, i made it with the script tag and it works.