Transform your website into a model of RGPD compliance with Finsweet Cookie Consent and Cloudflare, offering a seamless and secure user experience.
When you own a website, depending on the information you collect and your location, you need to comply with various regulations. One of the best-known regulations concerns data protection for users in the European Union: the RGPD.
In this article, we'll explore one of the essential rules for being RGPD compliant: storing cookie consents. We'll look at how, on our Webflow site, it's possible to store cookies using Finsweet Cookies Consents and Cloudflare completely free of charge to comply with the current standards.
RGPD, Cookies, Storage and Website Compliance?
General rule
If you are a business or other entity based in the European Union (EU) and own a website, you must comply with the GDPR(General Data Protection Regulation). This requirement also applies to companies or entities based outside the EU, but collecting data on users residing in the European Union.
The RGPD imposes numerous rules to preserve and guarantee users' personal information. If you manage a website and have to comply with the RGPD, you'll inevitably find yourself faced with the issue of making your website's cookies compliant.
Definition - Cookies : small text files that websites store on your browser to remember your preferences and offer you a more personalized online experience.
These cookies represent information, data collected by websites about you. Under the RGPD, they must be protected and stored. But why store cookie consents? It's much more than ticking boxes to comply with the law. Here's why it's crucial, in a few key points:
- Respect for privacy: storing consents means you respect your users' private space, a bit like knocking on the door before entering.
- Building trust: Users want to be sure that their data is in safe hands. By storing consent, you establish a relationship of trust.
- Avoid legal trouble: Poor data management can lead to legal problems. Properly storing consents means avoiding legal trouble - a legal shield for your site.
- Anonymizing IP addresses: Let's not forget IP addresses. By anonymizing them, you strengthen data protection, a bit like scrambling the map to protect the treasure.
New 2024 regulations
Since March 2024, regulations have changed for managing cookie consents with Google tools. If you use solutions such as Google Analytics or Google Ads, you'll need to use a cookie management solution compatible with Google Consent Mode V2.
Guide to Google Consent Mode V2
How do I store consent for cookies on my Webflow site?
1 - Requirements for storing cookie consent data
Before getting down to the nitty-gritty, there are a few things you'll need to consider in advance:
- Own a Webflow project.
- Integrate the Finsweet Cookie Consent solution into your project (Please note that this article does not present how to integrate the Finsweet Cookie Consent solution into Webflow, but rather how to store consents once the solution is already in place).
- Get a Cloudflare account (free).
2 - Creating a Cloudflare account
If you're new to Cloudflare, let's find out how to create an account quickly.
Tool - Cloudflare: Cloudflare is a cloud services platform offering solutions for security, performance and content distribution, helping to improve the availability and protection of websites.
To get started, go to the Cloudflare registration page. In the "Developer platform" tab, select the"Workers: free offer".
![Free Workers Plan Cloudflare](https://cdn.prod.website-files.com/64760069e93084646c9ee428/66d02c1584c758afb27e0842_65a90fb1e34d20fe97080b4c_plan-workers-cloudflare.webp)
Next, you'll be taken to a page where you can create your account by providing an e-mail address and password.
![Cloudflare account verification](https://cdn.prod.website-files.com/64760069e93084646c9ee428/66d02c1584c758afb27e0845_65a90fdf0684caa57b398dc0_cloudflare-inscription.webp)
Once you've created your account, be sure to verify it according to the instructions provided.
![Cloudflare account verification](https://cdn.prod.website-files.com/64760069e93084646c9ee428/66d02c1584c758afb27e0848_65a9109ab5a57f04a691384f_verification-compte-cloudflare.webp)
3 - Configuring data logging - Technical part
3.1 - Creating a Cloudflare Worker
Once your Cloudflare account has been validated, go to the"Workers & Pages" section and create a new"Worker" by clicking on"Overview" then"Create Worker".
Definition - Worker: a small program that runs directly on Cloudflare servers, allowing custom features to be added to websites without having to modify the original server code.
![Workers Cloudflare overview](https://cdn.prod.website-files.com/64760069e93084646c9ee428/66d02c1584c758afb27e084c_65a910ea42887bdcad53b9b3_Workers-cloudflare-overview.webp)
After clicking on the button to create the Worker, give it a name, preferably an explicit one. Then, further down the page, click on"Deploy" to deploy the newly created Worker.
![Cloudflare Worker creation](https://cdn.prod.website-files.com/64760069e93084646c9ee428/66d02c1584c758afb27e0850_65a91123454bc180d4cf10b2_Creation-worker-cloudflare.webp)
3.2 - Creating a namespace for KV Cloudflare
Once the Worker has been created, access the"KV" tab (still in the "Workers & Pages" submenu).
Definition - KV (Key-Value store): short for key-value store, this is a database that stores information in pairs (key-value, where a key is associated with a value), offering a fast and efficient way of storing and retrieving data. It is often used with Cloudflare Workers to manage information dynamically.
On the KV page, create anamespace by clicking on"Create a namespace". Assign a name to your namespace, then click on"Add".
Definition - Namespace: a storage space dedicated to a specific set of data within Cloudflare's Key-Value (KV) database. It allows data to be organized and structured separately, providing better management and isolation of the information stored in the KV store.
![Creating a Cloudflare namespace / KV](https://cdn.prod.website-files.com/64760069e93084646c9ee428/66d02c1584c758afb27e0884_65a9115e454bc180d4cf4cb2_creation-namespace-kv-cloudflare.webp)
Your namespace has now been successfully created.
![KV Cloudflare Created](https://cdn.prod.website-files.com/64760069e93084646c9ee428/66d02c1584c758afb27e0881_65a9119ecf37eb7a17254a3c_kv-cree-cloudflare.webp)
3.3 - Modifying your Worker with the Finsweet Cookie Consents Script
Now return to the"Overview" section to locate your"Worker". Click on it to access editing.
![Cloudflare workers overview](https://cdn.prod.website-files.com/64760069e93084646c9ee428/66d02c1584c758afb27e0853_65a911d44a669225ac37cd5e_overview-workers-cloudflare.webp)
In the Worker editing interface, locate the"Quick edit" button in the top right-hand corner and click on it.
![Edition worker cloudflare](https://cdn.prod.website-files.com/64760069e93084646c9ee428/66d02c1584c758afb27e0856_65a912344e1e39c3b7014003_edition-worker-cloudflare.webp)
Once in the code section, delete the existing code.
![Default script Worker](https://cdn.prod.website-files.com/64760069e93084646c9ee428/66d02c1584c758afb27e0875_65a912663eace3885764166d_worker-script-default.webp)
Then paste the code from the Finsweet Cookie Consents script:
Finally, click on the "Save and deploy" button in the top right-hand corner.
![finsweet cookie consents script for worker cloudflare](https://cdn.prod.website-files.com/64760069e93084646c9ee428/66d02c1584c758afb27e087b_65a912a3fca5333c888eb8e6_script-finsweet-cookie-consents-worker-cloudflare.webp)
![Save and deploy worker Cloudflare](https://cdn.prod.website-files.com/64760069e93084646c9ee428/66d02c1584c758afb27e0859_65a912d9195b5f98de0e524f_save-deploy-worker-cloudflare.webp)
3.4 - Linking the "Worker" to the "KV
After saving and deploying the Worker, return to the Worker editing interface.
Now go to the"Settings" section, then"Variables".
![Cloudflare Worker Settings Variables](https://cdn.prod.website-files.com/64760069e93084646c9ee428/66d02c1584c758afb27e0878_65a913113eace388576495ff_cloudflare-worker-parametres-variables.webp)
Moving down a little, look for the section entitled"KV Namespace Bindings".
![Linking KV namespace and a Cloudflare worker](https://cdn.prod.website-files.com/64760069e93084646c9ee428/66d02c1584c758afb27e085c_65a91366fde87aa48a5929e8_kv-namespace-bindings-worker-cloudflare.webp)
Click on the"Add binding" button. Please note that :
- For variable names, use"CONSENTS" in uppercase.
- For "KV", select the "KV" you created earlier.
![Edit Variables to link the worker with the correct KV for cookies](https://cdn.prod.website-files.com/64760069e93084646c9ee428/66d02c1584c758afb27e085f_65a913e13ea101b31aa217a6_KV-variable-worker-cloudflare-cookies-finsweet.webp)
Finally, click on"Save and deploy"!
![KV and Worker well linked in Cloudflare with Cookie Consent from Finsweet](https://cdn.prod.website-files.com/64760069e93084646c9ee428/66d02c1584c758afb27e0887_65a91448712368d0a117390a_KV-namespace-bindings-workers-done-cloudflare.webp)
3.5 - Recovering your Worker's Endpoint URL
When you're in your Worker editor, at the very top of the page, look for a preview link. This is your endpoint URL.
Definition - Endpoint: a specific URL or single access point in an API (Application Programming Interface) or web service. It represents the destination where requests can be sent to interact with an application or access specific functionality. Endpoints are defined to perform operations such as retrieving, modifying, adding or deleting data from a resource via the API. In short, an endpoint is a specific address enabling applications or services to communicate with each other via HTTP or similar protocols.
![Link to preview cloudflare worker endpoint URL](https://cdn.prod.website-files.com/64760069e93084646c9ee428/66d02c1584c758afb27e087e_65a914a723e468a4aa33a2ab_Endpoint-url-worker-cloudflare-preview.webp)
In this step, you will :
- Open the endpoint URL in a new tab (IMPORTANT).
- Copy the endpoint URL from the new tab.
![Retrieve the endpoint URL of the worker cookie consent](https://cdn.prod.website-files.com/64760069e93084646c9ee428/66d02c1584c758afb27e0865_65a914e875aa6339f3de14f7_recuperer-endpoint-url-worker-cookie-consent.webp)
3.6 - Setting up the Finsweet Cookie Consent script in your Webflow project
The last step in this tutorial is to return to your Webflow project and access your project's"custom code"(the place where you integrated the Finsweet Cookie Consent script).
![Finsweet Cookie Consent Script in Webflow](https://cdn.prod.website-files.com/64760069e93084646c9ee428/66d02c1584c758afb27e0862_65a9151ef8b96a7853df5e32_webflow-custom-code-finsweet-cookie-consent.webp)
Modify this script by adding fs-cc-endpoint="[URL endpoint Cloudflare]" inside, replacing [URL endpoint Cloudflare] with the URL you previously copied.
![Finsweet Cookie Consent Script in Webflow with endpoint URL Cloudflare](https://cdn.prod.website-files.com/64760069e93084646c9ee428/66d02c1584c758afb27e0868_65a91545eefece84261102a5_webflow-custom-code-finsweet-cookie-consent-endpoint-url.webp)
Publish your Webflow project, and that's it! You now have a mechanism that retrieves cookie consents from your site's users.
Retrieve my Webflow site's cookie consents in Cloudflare
Now that everything's set up, let's see how to access cookie consent records.
To do this, go to Cloudflare, then to the "KV" tab.
![All KV Cloudflar](https://cdn.prod.website-files.com/64760069e93084646c9ee428/66d02c1584c758afb27e086f_65a9159aff0649e8d6039244_KV-cloudflare.webp)
Then click on the"view" button to access all the consents submitted from your website.
![List of cookie consents submitted from the Webflow site to a KV Cloud](https://cdn.prod.website-files.com/64760069e93084646c9ee428/66d02c1584c758afb27e086c_65a915d0198eb315068516a5_entrees-kv-cloudflare-consentements-cookies-finsweet-solution.webp)
You can obtain detailed information on each value by clicking on "view". The key points to remember are as follows:
- "Allow" means that the user has accepted all cookies.
- "Deny" means that the user has rejected all cookies.
- "Submit" means that the user has changed their cookie preferences (you can find details of accepted cookies in the information).
![Information from a KV key value in Cloudflare about a modified cookie consent](https://cdn.prod.website-files.com/64760069e93084646c9ee428/66d02c1584c758afb27e08c9_65a916159b2c793bfe69f5e2_informations-KV-valeur-consentements-cookies-finsweet-soultion.webp)
Conclusion
Congratulations, you're now ready to ensure your website's RGPD compliance by storing cookie consents thanks to Finsweet Cookie Consent and Cloudflare. For an in-depth exploration, we recommend you consult the full Finsweet Cookie Consent documentation. In particular, you'll find details if you plan to use your own endpoint API instead of Cloudflare to store these consents.
By equipping yourself with these powerful tools, you not only strengthen the protection of your users' data, but also build solid trust with your audience. Don't forget to keep abreast of legislative developments and best practices to maintain ongoing compliance.
If you use Axeptio, learn how to translate your banners according to the language of your page.