Cookie Manager for TYPO3 with Optin Panel, grouping and GTM Support
Features
- HTML/Script tag management
- Google Consent Mode V2 !!! New since April 2024
- Grouping of different Cookies alias Script tags
- Multi-domain ready
- Multi-language ready
- Out of the box english and german frontend redering
- Cookie Information Table
- Optin Panel, which loads the scripts only after the confirmation
- Google Tag Manager support.
- Customizable, use your own CSS or change the Fluid templates
- Uses Custom Javascript events
- Supports TypoScript Constants processing inside the cookie HTML (development sponsored by Gesellschaft für Informatik - gi.de) - !Feature must by enabled inside the extension settings
- Documentation on german
Setup
Install the extension "om cookie manager" with the extension manager.
Add a folder to your page tree
Add a Cookie Panel.
INFO:the Extension will render always the first created and active panel per language
Add a cookie group
Add Cookies (inside the Cookie group) and their Script Tags.
INFO:you can setup cookies also without HTML/Script tags only for the purpose to have them listed inside info the table.
Reopen the Cookie Panel and select the groups you want to show in the optin panel. The choosen order will be respected.
Add the extension typoscript to your main template and set the right storage PID in the constants editor.
INFO: In this way you can set a diffrent folder for every domain you use.
Congratulations you are done!
INFO: if there is some visual problem inside the optin panel usually some page CSS are interfering with the delivered CSS
NOTE: There is a small attribution text and backlink inside the optin panel if you are a good samaritan you let it be. Thanks a lot if you decid to do so.
Google Consent Mode V2 - Set up (possible from version 12.1.0)
With version 12, the default parameters required by Google Consent Mode V2 are stored in the DataLayer thanks to the setting in the constants. This behavior can be controlled via the setting in the TypoScript constants. This setting is active by default.
INFO: If it is desired to send other default values, these can be stored in the page.headerData.1234 of TYPO3 and the setting should be deactivated then.
In the cookie/service groups in the "Google" tab, the approvals for Consent Mode V2 categories can now be granted according to your preference. It is possible to give the same approval in two different groups. The "granted" status is only transferred once to the DataLayer. The sum of the approvals of all accepted groups is transferred once at the end of the process.
Example: If "AD Storages" is set in group A and "AD Storages" and "AD User Data" in group B and the user accepts groups A and B, then "AD Storages" and "AD User Data" are sent to the DataLayer (Google) as "Granted" once at the end of the loading process.
weitere Details:
If Google Analytics or the Google Tag Manager (GTM) is loaded in advance without the Cookie Manager, for example via page.headerData, make sure or check in Google Tools that the default values of the Google Consent V2 categories are set or arrive correctly. A direct integration via page.headerData, was possible without problems during the development and tests. This is because the default values, which are set by the Cookie Manager by default, are set in advance. If this is not the case or does not work with the type of integration you have implemented, then the sending of default values should be disabled in the constants of the extension and these should then be set beforehand depending on the selected integration (see https://developers.google.com/tag-platform/security/guides/consent?consentmode=advanced#gtag.js_3)
- Google Analytics or GTM can also be integrated directly via one of the groups, the status update of the Google Consent categories takes place after the integration of the scripts which are integrated via the cookies HTML.
- Tutorial: Integration of Google Consent Mode V2 in an OM Cookie Manager version below 12.1.0.
Setup addtional information table
Add the Plugin on the page where the information table should be shown, save and you are done again!
Addtional Information
Automatic frontend cache clear (default: true - extension settings):
Inside the the extension settings you will find the option for automatic frontend cache clear when changes at groups or panels are made. Default setting is true. When you disable this setting you have to clear the cache manually after changes at groups or panels, otherwise the changes will not be rendered.
Google Tag Manager Events:
Google Tag Manager Events are pushed only when a Google Tag Manager event name is set inside the group record.
Javascript and CSS:
The assets are not minified, you can take those from the extension, save them elsewhere, modify them and adjust the path inside the constants of the extension
Adding noscript tags over the cookie manager:
this will not workout because, for now, the data is set only via javascript. Trying to set a piece of html with javascript that should load only when no javascript is available, seems not a good idea ;) .
Language keys:
The language keys can be overridden by typoscript as usually. Checkout the TYPO3 wiki
Template changes:
If you change the fluid template please have a look at the data-tags, this data tags must be preserved or the javascript functionality will break.
Javascript events and omCookieConsent cookie (for developers):
You can listen to the event "cookieconsentscriptsloaded" dispatched after the html is put at the right place and the scripts are loaded or you can use the event "cookieconsentsave" dispached after saveing the optin panel. The events are dispatched on the first element found with the data tag "data-omcookie-panel", they bubbels both. The events are quite nice to use together with the cookie "omCookieConsent" that is set after the save action, here you will find the different allowed groups (the number is the uid from the group). If you are smart you can dispatch other stuff based on this, like loading google maps and so on when the right group is set.
TypoScript Constants processing (default: false - extension settings):
you can use inside the HTML part of your cookie configuration typoscript constants like {$page.trackingid}. This constants will be processed and correctly rendered on the frontend side.
Requierments
- TYPO3 7,8,9,10,11 and TYPO3 12
- PHP >= 7.0 (probably it works also with 5.5 and 5.6 but is not tested)
- Works in IE11 and all modern Browsers