# Show cookie consent on selected page

**URL:** <https://community.piwik.pro/t/show-cookie-consent-on-selected-page/952>\
**Category:** Privacy\
**Created:** [September 2, 2022, 10:23am UTC](https://community.piwik.pro/t/show-cookie-consent-on-selected-page/952 "2022-09-02T10:23:19Z")\
**Posts on this page:** 20\
**Page:** 1

<div class="post-metadata">

**Author:** ![Vladyslav\_Zhovklyi](https://dub1.discourse-cdn.com/flex005/user_avatar/community.piwik.pro/vladyslav_zhovklyi/32/696_2.png) [@Vladyslav\_Zhovklyi](https://community.piwik.pro/u/Vladyslav_Zhovklyi)\
**Post date:** [September 2, 2022, 10:23am UTC](https://community.piwik.pro/t/show-cookie-consent-on-selected-page/952/1 "2022-09-02T10:23:19Z")

</div>

Hi, in case, if I want to show Cookie Consent dialog only on specific URL, is there a way to show it conditionally (only on select page or pages)?

---

<div class="post-metadata">

**Author:** ![Admin](https://avatars.discourse-cdn.com/v4/letter/a/3ec8ea/32.png) [@Admin](https://community.piwik.pro/u/Admin)\
**Post date:** [September 2, 2022, 11:47am UTC](https://community.piwik.pro/t/show-cookie-consent-on-selected-page/952/2 "2022-09-02T11:47:07Z")

</div>

What would be the behaviour on those where it’s not shown? I’d go with the [CM JS api](https://developers.piwik.pro/en/latest/consent_manager/js_api/index.html) here. There are dedicated methods to save the consent decision as well as to simply display the form once again. There are also code samples available [here](https://piwikpro.github.io/ConsentManager-CustomConsentFormExample/implementation-guide.html).

---

<div class="post-metadata">

**Author:** ![Vladyslav\_Zhovklyi](https://dub1.discourse-cdn.com/flex005/user_avatar/community.piwik.pro/vladyslav_zhovklyi/32/696_2.png) [@Vladyslav\_Zhovklyi](https://community.piwik.pro/u/Vladyslav_Zhovklyi)\
**Post date:** [September 2, 2022, 12:05pm UTC](https://community.piwik.pro/t/show-cookie-consent-on-selected-page/952/3 "2022-09-02T12:05:45Z")

</div>

So, we want to have 2 different behaviors.

1. Pages without consent: analytics collects data as it is.
2. Pages with consent: analytics supposes to collect data after user accept it.  
Is it possible to do with CM API?

---

<div class="post-metadata">

**Author:** ![Admin](https://avatars.discourse-cdn.com/v4/letter/a/3ec8ea/32.png) [@Admin](https://community.piwik.pro/u/Admin)\
**Post date:** [September 2, 2022, 12:33pm UTC](https://community.piwik.pro/t/show-cookie-consent-on-selected-page/952/4 "2022-09-02T12:33:00Z")

</div>

Try to run the following code on pages where you’d like the consent to be applied automatically:

```auto
ppms.cm.api(
  "setInitialComplianceSettings",
  { consents: ["analytics"] },
  function () {},
  function () {}
);
ppms.cm.api(
  "setComplianceSettings",
  { consents: { analytics: { status: 1 } } },
  function () {},
  function () {}
);
document.getElementById('ppms_cm_consent_popup_<your site id>').style.display = "none";

```

But this will also store the consent decision globally for all other pages. Not sure what you’d like to achieve.

You can also do it the other way round. To open the consent form after the consents have been saved, you can use the following code:

```auto
ppms.cm.api('openConsentForm', function(){}, function(){});

```

Alternatively, you could install another container code on those sites that you’d like to track always. You configure this container to not require consent and add the custom async tag to start tracking data. Here you have example code: [how to install analytics via custom tag](https://help.piwik.pro/support/getting-started/no-piwik-pro-tag-manager-install-a-tracking-code/).

---

<div class="post-metadata">

**Author:** ![Vladyslav\_Zhovklyi](https://dub1.discourse-cdn.com/flex005/user_avatar/community.piwik.pro/vladyslav_zhovklyi/32/696_2.png) [@Vladyslav\_Zhovklyi](https://community.piwik.pro/u/Vladyslav_Zhovklyi)\
**Post date:** [September 2, 2022, 6:54pm UTC](https://community.piwik.pro/t/show-cookie-consent-on-selected-page/952/5 "2022-09-02T18:54:26Z")

</div>

For better understanding what I want to achieve:  
We have an application where users can create landing pages and publish with unique URL. Then users can track analytics on that pages. On our app, PIWIK analytics installed globally, and we filter data by user id, org id etc. to show specific data for specific URL. And we want to have an option to add or remove cookie consent for each page user creates.  
As I understood from your message above, it’s not really achievable?

---

<div class="post-metadata">

**Author:** ![Admin](https://avatars.discourse-cdn.com/v4/letter/a/3ec8ea/32.png) [@Admin](https://community.piwik.pro/u/Admin)\
**Post date:** [September 2, 2022, 8:33pm UTC](https://community.piwik.pro/t/show-cookie-consent-on-selected-page/952/6 "2022-09-02T20:33:22Z")

</div>

Didn’t say that. There are multiple ways to configure it. I suggested a few, and hope those will be useful.

---

<div class="post-metadata">

**Author:** ![Calle\_Khan](https://dub1.discourse-cdn.com/flex005/user_avatar/community.piwik.pro/calle_khan/32/1052_2.png) [@Calle\_Khan](https://community.piwik.pro/u/Calle_Khan)\
**Post date:** [December 19, 2022, 2:10pm UTC](https://community.piwik.pro/t/show-cookie-consent-on-selected-page/952/7 "2022-12-19T14:10:59Z")

</div>

Hi, I tried your solution:

```auto
ppms.cm.api('openConsentForm', function(){}, function(){});

```

to show the form after page load. But this do not work. If I call this in the browser console, the form will appear.  
I guess I have to wait for the API to be ready and therefore i put this call into

```auto
  document.addEventListener("DOMContentLoaded", function(){
    ppms.cm.api('openConsentForm', function(){}, function(){});
  });

```

but without luck. Is there a callback function which I can use for it?

Background is, since it is not possible to hide the consent on specific pages  
like Privacy Policy or Impressum.

> [@Disable CMP Loading on specific pages](https://community.piwik.pro/t/disable-cmp-loading-on-specific-pages/581):
>
> Hey everybody, We’re currently implementing Piwik via the React component. But what we’re not finding is a way to Hide or rather not show the Consent on specific pages Eg. Privacy Policy or Impressum Did we miss something?

(or did this change menawhile?)  
We use a link to another page where the user can modify the settings.  
To avoid the user must click once more to get the modal open, we would like to show this after loading the page automaticly.

---

<div class="post-metadata">

**Author:** ![Admin](https://avatars.discourse-cdn.com/v4/letter/a/3ec8ea/32.png) [@Admin](https://community.piwik.pro/u/Admin)\
**Post date:** [December 19, 2022, 2:51pm UTC](https://community.piwik.pro/t/show-cookie-consent-on-selected-page/952/8 "2022-12-19T14:51:50Z")

</div>

I’d suggest to fire this code via our integrated Tag Manager. Just pick the custom async tag type and that will make sure you fire the code at the right time.

---

<div class="post-metadata">

**Author:** ![Calle\_Khan](https://dub1.discourse-cdn.com/flex005/user_avatar/community.piwik.pro/calle_khan/32/1052_2.png) [@Calle\_Khan](https://community.piwik.pro/u/Calle_Khan)\
**Post date:** [December 20, 2022, 10:12am UTC](https://community.piwik.pro/t/show-cookie-consent-on-selected-page/952/9 "2022-12-20T10:12:23Z")

</div>

Thank you for your answer.  
as suggested I created a custom async tag with trigger  
“Load this tag right after the browser” → Loaded all page elements (page load)  
but this do not open the modal.  
Then I used the trigger stg.timer which do open the modal, but a bit late.  
What would be the best trigger for the goal to show the modal right after the page was opened

---

<div class="post-metadata">

**Author:** ![Admin](https://avatars.discourse-cdn.com/v4/letter/a/3ec8ea/32.png) [@Admin](https://community.piwik.pro/u/Admin)\
**Post date:** [December 20, 2022, 10:32am UTC](https://community.piwik.pro/t/show-cookie-consent-on-selected-page/952/10 "2022-12-20T10:32:07Z")

</div>

That’s weird. Can you share the website URL where it’s implemented? Here or on priv.

---

<div class="post-metadata">

**Author:** ![Calle\_Khan](https://dub1.discourse-cdn.com/flex005/user_avatar/community.piwik.pro/calle_khan/32/1052_2.png) [@Calle\_Khan](https://community.piwik.pro/u/Calle_Khan)\
**Post date:** [December 20, 2022, 10:37am UTC](https://community.piwik.pro/t/show-cookie-consent-on-selected-page/952/11 "2022-12-20T10:37:47Z")

</div>

No sorry, it is a local docker environment. I didn’t deploy this on the production page

---

<div class="post-metadata">

**Author:** ![Admin](https://avatars.discourse-cdn.com/v4/letter/a/3ec8ea/32.png) [@Admin](https://community.piwik.pro/u/Admin)\
**Post date:** [December 20, 2022, 10:44am UTC](https://community.piwik.pro/t/show-cookie-consent-on-selected-page/952/12 "2022-12-20T10:44:28Z")

</div>

Ok, so maybe some more details on how the container is implemented? What’s the technology used to build the app?

---

<div class="post-metadata">

**Author:** ![Calle\_Khan](https://dub1.discourse-cdn.com/flex005/user_avatar/community.piwik.pro/calle_khan/32/1052_2.png) [@Calle\_Khan](https://community.piwik.pro/u/Calle_Khan)\
**Post date:** [December 20, 2022, 11:06am UTC](https://community.piwik.pro/t/show-cookie-consent-on-selected-page/952/13 "2022-12-20T11:06:09Z")

</div>

It is a ddev environment based on docker container. It is a 1:1 image from production CMS. We build an extension (TYPO3) to implement Piwik pro on.  
It is already running at [https://rw.net](https://rw.net)

There is the requirement that the modal should not show on defined pages.  
We use a link to another page where the user can modify the settings.  
To avoid the user must click once more to get the modal open, we would like to show this after loading the page automatically.

---

<div class="post-metadata">

**Author:** ![Admin](https://avatars.discourse-cdn.com/v4/letter/a/3ec8ea/32.png) [@Admin](https://community.piwik.pro/u/Admin)\
**Post date:** [December 20, 2022, 12:31pm UTC](https://community.piwik.pro/t/show-cookie-consent-on-selected-page/952/14 "2022-12-20T12:31:33Z")

</div>

Thanks for the context. And how this extension adds the installation code to the website? I know that different CMS have different policies on that.

---

<div class="post-metadata">

**Author:** ![Calle\_Khan](https://dub1.discourse-cdn.com/flex005/user_avatar/community.piwik.pro/calle_khan/32/1052_2.png) [@Calle\_Khan](https://community.piwik.pro/u/Calle_Khan)\
**Post date:** [December 20, 2022, 12:49pm UTC](https://community.piwik.pro/t/show-cookie-consent-on-selected-page/952/15 "2022-12-20T12:49:01Z")

</div>

By a script tag in the html code. You can see this by viewing the source code.

---

<div class="post-metadata">

**Author:** ![Calle\_Khan](https://dub1.discourse-cdn.com/flex005/user_avatar/community.piwik.pro/calle_khan/32/1052_2.png) [@Calle\_Khan](https://community.piwik.pro/u/Calle_Khan)\
**Post date:** [December 20, 2022, 1:29pm UTC](https://community.piwik.pro/t/show-cookie-consent-on-selected-page/952/16 "2022-12-20T13:29:37Z")

</div>

The script tag position is at the end and we are working with variables for the key and the url,  
but this should not be the probem, isn’t?

```auto
        <script type="text/javascript">
            const consentManagerKey = `xxx`;
            const consentManagerURL = `xxx`;

            (function(window, document, dataLayerName, id) {
                window[dataLayerName]=window[dataLayerName]||[],window[dataLayerName].push({start:(new Date).getTime(),event:"stg.start"});var scripts=document.getElementsByTagName('script')[0],tags=document.createElement('script');
                function stgCreateCookie(a,b,c){var d="";if(c){var e=new Date;e.setTime(e.getTime()+24*c*60*60*1e3),d="; expires="+e.toUTCString()}document.cookie=a+"="+b+d+"; path=/"}
                var isStgDebug=(window.location.href.match("stg_debug")||document.cookie.match("stg_debug"))&&!window.location.href.match("stg_disable_debug");stgCreateCookie("stg_debug",isStgDebug?1:"",isStgDebug?14:-1);
                var qP=[];dataLayerName!=="dataLayer"&&qP.push("data_layer_name="+dataLayerName),isStgDebug&&qP.push("stg_debug");var qPString=qP.length>0?("?"+qP.join("&")):"";
                tags.async=!0,tags.src="//" + consentManagerURL + "/"+id+".js"+qPString,scripts.parentNode.insertBefore(tags,scripts);
                !function(a,n,i){a[n]=a[n]||{};for(var c=0;c<i.length;c++)!function(i){a[n][i]=a[n][i]||{},a[n][i].api=a[n][i].api||function(){var a=[].slice.call(arguments,0);"string"==typeof a[0]&&window[dataLayerName].push({event:n+"."+i+":"+a[0],parameters:[].slice.call(arguments,1)})}}(i[c])}(window,"ppms",["tm","cm"]);
            })(window, document, 'dataLayer', consentManagerKey);
        </script>

```

---

<div class="post-metadata">

**Author:** ![Admin](https://avatars.discourse-cdn.com/v4/letter/a/3ec8ea/32.png) [@Admin](https://community.piwik.pro/u/Admin)\
**Post date:** [December 20, 2022, 1:33pm UTC](https://community.piwik.pro/t/show-cookie-consent-on-selected-page/952/17 "2022-12-20T13:33:13Z")

</div>

No. Those are the URL for the tag manager container and the property ID. I’ve forwarded the question about needed delay to the dev team, maybe they will have some ideas.

---

<div class="post-metadata">

**Author:** ![Calle\_Khan](https://dub1.discourse-cdn.com/flex005/user_avatar/community.piwik.pro/calle_khan/32/1052_2.png) [@Calle\_Khan](https://community.piwik.pro/u/Calle_Khan)\
**Post date:** [December 20, 2022, 2:04pm UTC](https://community.piwik.pro/t/show-cookie-consent-on-selected-page/952/18 "2022-12-20T14:04:13Z")

</div>

Some additional information from debug screen.  
My custom tag is fired and the string ‘tag’ will get out in the Browser devtools, but the modal do not open

![openConsentForm#1](https://europe1.discourse-cdn.com/flex005/uploads/piwikpro/original/2X/8/80df3f5aea9b8ae15a50c862e430be85b86dde69.png)

 ![openConsentForm#2](https://europe1.discourse-cdn.com/flex005/uploads/piwikpro/original/2X/1/1d08bf1090a0a76915717e6f4009d8278a3f0af0.png)

---

<div class="post-metadata">

**Author:** ![Admin](https://avatars.discourse-cdn.com/v4/letter/a/3ec8ea/32.png) [@Admin](https://community.piwik.pro/u/Admin)\
**Post date:** [December 20, 2022, 7:31pm UTC](https://community.piwik.pro/t/show-cookie-consent-on-selected-page/952/19 "2022-12-20T19:31:15Z")

</div>

Let’s try with `ppms.cm.api('openConsentForm', console.log, console.error);` to see a bit more.

---

<div class="post-metadata">

**Author:** ![Calle\_Khan](https://dub1.discourse-cdn.com/flex005/user_avatar/community.piwik.pro/calle_khan/32/1052_2.png) [@Calle\_Khan](https://community.piwik.pro/u/Calle_Khan)\
**Post date:** [December 21, 2022, 9:00am UTC](https://community.piwik.pro/t/show-cookie-consent-on-selected-page/952/20 "2022-12-21T09:00:56Z")

</div>

> [@Admin](#):
>
> ppms.cm.api(‘openConsentForm’, console.log, console.error);

Uh, yes. If I switch from

```auto
ppms.cm.api('openConsentForm', function(){}, function(){});

```

to

```auto
ppms.cm.api('openConsentForm', console.log, console.error);

```

do I get the following error in the Browser console.

**ApiCommandError: Failed to render consent popup: No templates**

[Next page](https://community.piwik.pro/t/show-cookie-consent-on-selected-page/952.md?page=2)