Cookie Disclaimer Popup

Example

Add script above Google Tag Manager script

			
				<script>
				window.dataLayer = window.dataLayer || [];
				function gtag(){dataLayer.push(arguments);}

				gtag('consent', 'default', {
				  'ad_storage': 'denied',
				  'ad_user_data': 'denied',
				  'ad_personalization': 'denied',
				  'analytics_storage': 'denied'
				});
				</script>
			
		

CSS

        
          /* Cookie Disclaimer */
          #cookie-disclaimer { position: fixed; bottom: 10px; right: 10px; margin-left: 10px; background: var(--gray); padding: 20px; z-index: 99999; border-radius: 4px; display: flex; box-shadow: 0 5px 10px rgba(0, 0, 0, 0.19), 0 2px 4px rgba(0, 0, 0, 0.23); align-items: center; }
          #cookie-disclaimer p { margin: 0; }
          #cookie-disclaimer a { text-decoration: underline; }
          #cookie-disclaimer button { border: 0; border: 1px solid var(--primary); background: var(--primary); color: #fff; padding: 10px 25px; margin-left: 15px; transition: 0.4s; }
          #cookie-disclaimer button:hover { background: #fff; color: var(--primary); }
          #cookie-disclaimer button[data-consent="decline"] { border: 1px solid #666; background: #666; }
          #cookie-disclaimer button[data-consent="decline"]:hover { color: #666; background: #fff; }
        
      

Javascript

Add to Master.js

        

		// Cookie Disclaimer
		function allConsentGranted() {
		   gtag('consent', 'update', {
		     'ad_storage': 'granted',
		     'ad_user_data': 'granted',
		     'ad_personalization': 'granted',
		     'analytics_storage': 'granted'
		   });
		};
		function allConsentDenied() {
		   gtag('consent', 'update', {
		     'ad_storage': 'denied',
		     'ad_user_data': 'denied',
		     'ad_personalization': 'denied',
		     'analytics_storage': 'denied'
		   });
		};

		function showDisclaimer() {
		   var shownDate = new Date();
		   shownDate.setDate(shownDate.getDate() + 1); //Set Expiration for 1 day from now
		   localStorage.setItem('disclaimerDate', shownDate);
		   $('body').append(`<div id="cookie-disclaimer" class="animated-slow animate-5 fadeInRight"><p>This website uses cookies to ensure you get the best experience on our website. <a href="/privacy-policy">Learn More</a></p><button data-consent="accept" type="button">Accept</button><button data-consent="decline" type="button">Decline</button></div>`)
		};

		function loadDisclaimer() {
		   var currentDate = Date();
		   var expDate = localStorage.getItem('disclaimerDate');
		   if ( localStorage.getItem('disclaimer') != 'shown' || Date.parse(expDate) < Date.parse(currentDate) ) {
		     showDisclaimer();
		   }
		   if (localStorage.getItem('consent') == 'accept'){
		     allConsentGranted();
		  } else {
		    allConsentDenied();
		  }
		};

		loadDisclaimer();

		$('#cookie-disclaimer button').click(function(){
		   let consent = $(this).data('consent');
		   if (consent == 'accept') {
		     allConsentGranted();
		   } else {
		     allConsentDenied();
		   }
		   localStorage.setItem('consent', consent);
		   localStorage.setItem('disclaimer', 'shown');
		   $('#cookie-disclaimer').fadeOut();
		});