Here's how you can use the free Flipdish cookie modal to help with meeting EU requirements on cookies.
We've built you a cookie management modal that you can use on your own site, that lets your website visitors easily manage their cookie preferences, meaning you can stay on the right side of GDPR and e-privacy directive compliance.
Warning: It's critical that you and your team understand GDPR, the e-privacy directive, and the correct management of cookies before adding this to your website. Simply adding the code will not make you compliant, the Flipdish cookie modal simply enables the easier management of cookies, but there will still likely be development work for you to do to classify your own cookies correctly, and only have your website use those cookies when the user has made the appropriate selection in the Flipdish cookie modal. This article does not constitute legal advice.
Here are the steps you need to complete to work towards compliance.
Add the code below to every page on your website
This code loads the Flipdish cookie modal into your website
<script type="text/javascript" src="https://flipdish-cookie-consent.s3-eu-west-1.amazonaws.com/www/production/latest/fd-cc.js"></script>
Launch the modal
On every page load, the page should initialize the cookie management, using the code below. If the user has made a choice before, the modal will not render. If the user has not made a choice, the modal will pop up and the user will need to make a choice before continuing to use the website.
When initializing the modal, there are 4 optional parameters:
cookiePolicyUrl
Required - the location of your cookie policy on your website
Lang
Optional - defaults to EN - A two-letter code representing the language to use
LogoUrl
Optional - The URL to your logo if you'd like to display it in the modal
restaurantName
Optional - The name of your business
(function() {
function docReady(fn) {
// see if DOM is already available
if (document.readyState === "complete" || document.readyState === "interactive") {
// call on next available tick
setTimeout(fn, 1);
} else { document.addEventListener("DOMContentLoaded", fn); }
}
docReady(function() {
window['fdCc'].init({
lang: 'en', // set the language to display
logoUrl: '', // a custom logo url
restaurantName: '', // your business's name
cookiePolicyUrl: '', // where users can find your cookie policy
})
})
})()
Handle your user's choice
So far, your users will see the cookie modal when they visit your site and will need to make a choice of what level of tracking they're comfortable with. However, we need to add some logic that handles when the user confirms their choice.
To do that, we can provide a callback function to the init() call. A comma-separated string of the cookies that your user has opted into will be passed to the callback function as its only argument
function(result) {
/*
we don't need to check for the 'necessary' value
those cookies can run without explicit consent
However, they must be categorized as such in your cookie policy,
and they must also actually be explicitly necessary
for the minimum functionality your site offers
*/
if (result.includes('functional')) {
console.log('Including the functional scripts');
/*
The user has accepted cookies classed as "functional"
We can use scripts that use cookies that are
classed under "functional" in your cookie policy
-- Paste functional scripts below --
*/
}
if (result.includes('performance')) {
console.log('Including the performance scripts');
/*
the user has opted in to the use of
cookies classed as "performance"
we can use scripts that use cookies that are
classed as "performance" in your cookie policy
-- Paste performance scripts below --
*/
}
if (result.includes('advertising')) {
console.log('Including the advertising scripts');
/*
the user has opted in to the use of
cookies classed as "advertising"
we can use scripts that use cookies that are
classed as "advertising" in your cookie policy
-- Paste advertising scripts below --
*/
}
}
The cookie categories
At the moment, the cookie modal lists 4 categories for the user.
- Necessary
These cookies are strictly necessary for the website to perform its necessary functions. For Flipdish web ordering, this means things like remembering authentication, and security cookies to enable secure payments.
- Functional
These cookies enable things like a longer authentication time, so the user doesn't have to log in every time. For you, they could be things like remembering user preferences.
- Performance
These cookies are for trackers that measure the performance of your site, for instance, Google Analytics. They do not include cookies to do with advertising.
- Advertising
These cookies are for providing a better ad experience for your user. One example that could fall into this category would be Facebook tracking pixels.
Please Note
This article is not intended to be legal guidance. It is only to describe how you might use the Flipdish cookie management modal to help achieve compliance on your site. Every website is different and uses different cookies for different purposes. Please seek legal advice for all matters concerning compliance in your jurisdiction.
For developers, see a working codepen here.
For more information please contact our support team via "help@flipdish.com".
To learn more about Flipdish’s products or how to grow your online business enroll for FREE in the Flipdish Academy here: http://academy.flipdish.com.
Comments
0 comments
Article is closed for comments.