GlowCookies - Automatic GDPR Cookies Banner for Google Analytics, Facebook Pixel & more
Simple and full automated cookies banner for any website. Complies with the new European regulations with only two lines of code. Activate and deactivate Google Analytics, Facebook Pixel, Hotjar (and coming soon) cookies whenever the user wishes, with just 1 click.
The cookies banner
How it works?
You just have to install the code. When the user clicks on accept cookies, the google analytics tracking code, Facebook Pixel and/or Hotjar starts tracking. If the user rejects cookies, the tracking code will not start working.
How to install it?
Add this code to your html <head>
tag.
<script src="https://cdn.jsdelivr.net/gh/manucaralmo/[email protected]/v1/cookiesGlow.js" async></script>
<script>
var AnalyticsCode = "UA-156900259-00"; // Your Analytics tracking code (Optional)
var FacebookPixelCode = "96272777700000"; // Your Facebook Pixel code (Optional)
var HotjarTrackingCode = "2027553"; // Your Hotjar id (Optional)
var linkHref = "https://link-to-your-cookies.html"; // Your Cookies Policy link
</script>
Important
- In
AnalyticsCode
(optional) you must add your tracking id that you can find in Google Analytics. - In
FacebookPixelCode
(optional) you must add your Facebook Pixel Code (Event: PageView). - In
HotjarTrackingCode
(Optional) you must add your Hotjar ID. - In
linkHref
you must add the link where users can read more about cookies.
Customize banner
And that's it. Now there are certain parameters that you can change to customize your banner.
Texts & content
btn1Text
- Change the text of "Accept cookies" button text.btn2Text
- Change the text of "Disable cookies" button.bannerDescription
- Change the text that appears on the banner. The default text is: "Utilizamos cookies propias y de terceros para personalizar el contenido y para analizar el tráfico de la web."linkTexto
- Change the text of the "Show more about cookies" link.linkHref
- Change the "Show more about cookies" link (Ej. https://link-to-your-cookies-policy.com).manageText
- Change the text of "manage cookies" button.
Colors
btn1Background
- Change the background color of the "Accept cookies" button.btn1Color
- Change the color of the text "Accept cookies" button.btn2Background
- Change the background color of the "Disable cookies" button.btn2Color
- Change the color of the text "Disable cookies" button.bannerBackground
- Change the background color of the cookies banner.descriptionColor
- Change the text color of the cookies description.manageColor
- Change the text color of "manage cookies" button.manageBackground
- Change the background color of "manage cookies" button.
Alignment & extras
bannerPosition
- ("left" or "right") Left default.border
- ("yes" or "none").
Example
<script src="https://cdn.jsdelivr.net/gh/manucaralmo/[email protected]/v1/cookiesGlow.js" async></script>
<script>
var AnalyticsCode = "UA-156900259-00";
var FacebookPixelCode = "96272777700000";
var HotjarTrackingCode = "2027553";
var linkHref = "https://link-to-your-cookies.html";
// texts
var btn1Text = "Aceptar cookies";
var btn2Text = "Rechazar";
var bannerDescription = "Utilizamos cookies propias y de terceros para personalizar el contenido y para analizar el tráfico de la web.";
var linkTexto = "Ver más sobre las cookies";
var manageText = "Cookies";
// colors
var btn1Background = "#E8E8E8";
var btn1Color = "#17663D";
var btn2Background = "#E8E8E8";
var btn2Color = "#17663D";
var bannerBackground = "#17663D";
var descriptionColor = "#fff";
var manageColor = "#E8E8E8";
var manageBackground = "#17663D";
// Extras
var border = "none"
var bannerPosition = "right"
</script>
how to contribute?
Coming soon
Email - [email protected]