innoweb / silverstripe-cookie-consent
Creates a cookie consent popup and cookie policy page.
Installs: 3 010
Dependents: 0
Suggesters: 0
Security: 0
Stars: 3
Watchers: 3
Forks: 3
Open Issues: 0
Type:silverstripe-vendormodule
Requires
README
Overview
Creates a cookie consent popup and cookie policy page.
While we try to tick as many legal boxes as we can, we give no warranty for this module to adhere to any legislation, including GDPR.
This is an amended and simplified version of TheBnl's cookie consent module. Thanks for your work and inspiration!
Requirements
- Silverstripe CMS 5.x
Note: this version is compatible with Silverstripe 5. For Silverstripe 4, please see the 2 release line.
Installation
Install the module using composer:
composer require innoweb/silverstripe-cookie-consent
Then run dev/build.
Include the popup template in your base Page.ss
<% include CookieConsent %>
Configuration
You can configure the cookies and cookie groups trough the yml config. You need to configure by provider, for providers the dots are converted to underscores e.g. ads.marketingcompany.com becomes ads_marketingcompany_com.
By configuring cookies trough yml you can check for consent in your code and make the necessary changes e.g. require the analytics or other cookies or skip placing them.
The texts for the configured cookies are editable trough the Site Config, here other cookies can also be added by CMS users. For example if a site user decides to embed a Youtube video he or she can specify the cookies that are placed by Youtube. I reccomend the following three groups to be created, these have default content, of course you are free to configure groups as you see fit.
Innoweb\CookieConsent\CookieConsent: cookies: Necessary: local: - PHPSESSID - CookieConsent Marketing: ads_marketingcompany_com: - _track Analytics: local: - _ga - _gid
This module comes with some default content for cookies we've encountered before. If you want to set default content for these cookies yourself that is possible trough the lang files. If you have cookie descriptions that are not in this module, contributions to the lang files are much appreciated!
The files are structured as such:
en: CookieConsent_{provider}: {cookie}_Purpose: 'Cookie description' {cookie}_Expiry: 'Cookie expire time' # for cookies from your own domain: CookieConsent_local: PHPSESSID_Purpose: 'Session' PHPSESSID_Expiry: 'Session' # for cookies from an external domain: CookieConsent_ads_marketingcompany_com: _track_Purpose: 'Cookie description' _track_Expiry: 'Cookie expire time'
You can also configure the requirement of the default css styles.
Innoweb\CookieConsent\CookieConsent: include_css: true
Usage
Then you can check for consent in your PHP code by calling
if (CookieConsent::check('Analytics')) { // include analytics script }
In templates, you can check for consent using
<% if $CookieConsent(Analytics) %> // include analytics script <% end_if %>
The CookieConsent popup fires a custom JavaScript event updateCookieConsent
when the acceptance buttons in the popup
are clicked. You can use that event to conditionally load parts of your site depending on what cookies have been set.
JavaScript example
Here an example that lazy-loads a video embed only if marketing cookies have been accepted:
Template:
<% if $EmbedCode %> <div class="VideoEmbed js-load-video" data-required-cookies="Marketing"> <p class="message warning">Please accept marketing cookies to view this video.</p> <noscript><p class="message warning">Please enable JavaScript to view this video.</p></noscript> <div hidden> <!-- $EmbedCode.RAW --> </div> </div> <% end_if %>
Script:
let loadVideos = function() { // unwraps hidden embed code if correct cookie value is set let showVideo = function(video) { let requiredCookies = video.getAttribute('data-required-cookies'); let cookieValue = Cookies.get('CookieConsent'); if (requiredCookies === null || requiredCookies === '' || (cookieValue !== null && cookieValue.indexOf(requiredCookies) !== -1)) { let hidden = video.querySelector('[hidden]'); let content = hidden.innerHTML; // get content from within html comment content = content.replace(/<!--([\S\s]+?)-->/g, '$1'); // replace content video.innerHTML = content; video.classList.remove('js-load-video'); video.classList.add('js-video-loaded'); return true; } return false; }; // intersection observer to load video if in viewport let observer = new IntersectionObserver(function(entries, observer) { entries.forEach(function(entry) { if (entry.isIntersecting) { if (showVideo(entry.target)) { observer.unobserve(entry.target); } } }); }); // load all videos and observe let videos = document.querySelectorAll('.js-load-video'); videos.forEach(function(video) { observer.observe(video); }); }; // load videos on page init loadVideos(); // load videos when JavaScript event is fired document.addEventListener('updateCookieConsent', loadVideos);
Default Pages
This module also sets up one default privacy policy page on running dev/build.
If you want to prevent that behaviour you should disable the create_default_pages
config setting.
Innoweb\CookieConsent\CookieConsent: create_default_pages: false
The page created is filled with bare-bones content. Of course, it is your or your CMS users responsibility to alter these texts to make them fit your use case!
License
BSD 3-Clause License, see License