How to implement GDPR cookie popup support in your theme?

If you wish to add support for the GDPR cookie popup to your Publii theme, you will need to make a few simple but necessary changes to your theme:

Add the {{{ publiiFooter }}} helper before the </body> tag in your theme's code; if you're using a default Publii theme as a base then you can skip this step, but you will need to make sure that the theme is updated to the latest version.
Search for and catalogue any scripts which will need to be consented to run by your users, and separate them into groups depending on their specific function e.g. analytics, marketing etc...
For each script that should be blocked by default (before consent is given), add a type attribute with the {{ gdprScriptBlocker "group-name" }} value. For example, if you want to block a script from the analytics group, you would use:
```
<script src="analytics.js" type="{{ gdprScriptBlocker "analytics"}}"></script>
```
Once you've added this to all the relevant scripts, create a new post in Publii that will act as your Privacy Policy page. We recommend making it a hidden post so it does not appear in post listings, only in links from the popup or from links added to your menus.
In the Site Settings section of Publii, open the GDPR tab and enable the Add GDPR cookie banner option. Then, configure the popup content (description, labels etc...) and select your create Privacy Policy page from the list in the Privacy policy page option.
Next, define the script groups which will be managed by the cookie popup. For every script group you can define a group name and an ID. The group name will be seen by users as an available checkbox in the popup, whilst the ID should be the same as the group-name parameter that you set in the {{ gdprScriptBlocker }} helper for that particular group.
(Optional) If you're using the Access the popup as a custom link option, make sure to add a menu item or common website element which can be used as the link to display the GDPR cookie popup; remember that this link should be an anchor.

Your popup is now configured and ready to use.

Advanced integration

Since Publii v.0.39 cookie banner sends custom events for document.body after receiving consent for specific cookie groups.

So it is possible to run scripts after receiving user consent. These events uses the following names:

publii-cookie-banner-unblock-GROUPNAME

So for analytics it will be:

publii-cookie-banner-unblock-analytics

This event is sent when user gives consent and also when the consent has been saved and website is loaded again.

Some plugins uses this feature to integrate with cookie banner by cookie banner group name.

For example Facebook Comments plugin using these events hide information about required consent:

<script type="text/javascript">
   document.body.addEventListener('publii-cookie-banner-unblock-${this.config.cookieBannerGroup.trim()}', function () 
   {document.getElementById('fbcomments-no-consent-info').style.display = 'none';}, false);
</script>`;