Cookieman¶
! Warnings !¶
Expect some days until this is fixed:
This documentation is still v1 and not proper for the current v2.
Currently only the example theme bootstrap4-modal
is v2-ready.
Choose your branch: 8lts (TYPO3 8.7), 9lts (TYPO3 9.5), master (TYPO3 10.x).
To try it: just run ddev start
which will install a TYPO3 with
example content and cookieman
.
How it works¶
It includes the HTML for a cookie confirmation modal on every page.
It shows the modal when the cookie CookieConsent is not set yet. In the example templates it is not shown on the configured imprintPid and dataProtectionDeclarationPid (see TypoScript constants) - this is to follow the GDPR’s expectation that those pages shall be easily and directly accessible and should not interfere with a cookie consent banner.
It is recommended to include a snippet like that on your data protection page to allow your users to adjust their cookie preferences:
It saves the user’s choices as a comma-separated list of groups in the HTML cookie CookieConsent, e.g. “marketing,preferences”.
Your tracking solutions shall then adhere to this setting by checking if
their repective string (e.g. “marketing”) is contained in the cookie
CookieConsent. You should also pay respect to the “Do-not-track”
setting of your users which is sent as HTTP-Header DNT: 1
and
accessible in JavaScript via navigator.doNotTrack
. The example
templates include a dynamic text block that show this browser setting.
This can be done in Google Tagmanager or by dynamically including <script>s with JavaScript.
You could of course let your server handle that, too (in PHP, TypoScript, e.g.) but this is IMHO overkill and should only be necessary for edge cases.
Requirements¶
- If you reimplement your own theme, it has no requirements at all
- for the example HTML templates
- Bootstrap 3 CSS
- Bootstrap 3 JavaScript for collapses and modals
- jQuery
Installation¶
composer¶
Get it from packagist https://packagist.org/packages/dmind/cookieman
Run composer req dmind/cookieman
Integration¶
Include the TypoScript and adjust the constants.
It should get loaded automatically on every (except imprint and data
protection declaration) page. If it does not, check for errors in a
JavaScript console when calling cookieman.show()
manually.
Create a new theme¶
Copy the EXT:cookieman/Resources/ folder to your site package extension
and set the plugin.tx_cookieman.settings.resourcesBasePath
TypoScript constant. Choose a theme name, set it in the constant
plugin.tx_cookieman.settings.theme
and rename the example folders
(e.g. bootstrap3-banner) to your name.
Adapt the HTML/CSS/JS as needed. These elements control the functionality: * <* data-cookieman-save> - save and close * <* data-cookieman-accept-all> - accept all * <form data-cookieman-form> - the form that contains all checkboxes * change the checkboxes’ name=“…” to a value that you expect to find in the CookieConsent when the user consented (in the examples only one group called “marketing” is included)
If you are working a non-Bootstrap environment, you will have to
reimplement the methods cookieman.show() and cookieman.hide() (see the
example code in JavaScript/cookieman-theme.js
).
API¶
JavaScript¶
cookieman.js exposes these methods:
cookieman.showOnce(): void¶
Shows the confirmation modal only when the user preferences in the cookie CookieConsent are not yet present.
cookieman.show(): void¶
Shows the confirmation modal. You can call that from anywhere you need it (e.g. with a link from your data protection declaration page).
cookieman.hide(): void¶
Hides the confirmation modal.
cookieman.hasConsented(selection): Boolean¶
Returns true if the user has consented to the given selection, else false. A selection is any name of a checkbox in the popup, e.g. ‘marketing’
Cookieman also includes the (1kB) cookie library JavaScript Cookie that also exposes its API and makes it easier to work with cookies.
TODO¶
Translations¶
testing extension for Bootstrap 3¶
Access crowdin from ddev Development:¶
DNT per group respected¶
Not shown on Imprint and Data Declaration Page
ddev TYPO3 backend admin: admin / adminadmin
Browser compat: IE11, Firefox, Chrome, Safari
supports: <script> / img / any HTML
add hooks
Example¶
temp.tx_cookieman.settings.groups.mandatory < plugin.tx_cookieman.settings.groups.mandatory
plugin.tx_cookieman.settings { trackingObjects { # extend the existing configuration for ‘Matomo’ Matomo { inject (
)
}
# add my own custom tracking solution
MyOwnTrackingPixel {
inject (
)
show {
# each element here represents one line of information in the consent popup
pixelphp {
duration = 1
durationUnit = months
type = pixel
provider = My Website Inc.
}
}
}
}
# reset existing groups groups > groups { # copy of default group ‘mandatory’ mandatory < temp.tx_cookieman.settings.groups.mandatory
# my new group
mygroup {
trackingObjects {
0 = Matomo
1 = MyOwnTrackingPixel
}
}
} }
plugin.tx_cookieman._LOCAL_LANG { en { trackingobject.pixelphp = You can translate the name, but you do not have to. trackingobject.pixelphp.desc = My own tracking pixel does not really track you. It’s just here to cheer you up. group.mygroup = My group is my castle. } default < .en }