Last active
April 24, 2024 05:48
-
-
Save ayan-b/a1719e6e2b235302a144d915db8cfa97 to your computer and use it in GitHub Desktop.
Simple GDPR footer using JS Cookies for static websites
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| #gdpr { | |
| position: fixed; | |
| left: 0; | |
| bottom: 0; | |
| width: 100%; | |
| background-color: #e6e6e6; | |
| opacity: 0.85; | |
| text-align: center; | |
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| function closeAndAccept() { | |
| let gdprDiv = document.getElementById("gdpr"); | |
| gdprDiv.style.display = "none"; | |
| setCookie(); | |
| } | |
| function setCookie() { | |
| let date = new Date(); | |
| date.setTime(date.getTime() + (365*24*60*60*1000)); | |
| let expires = "expires=" + date.toGMTString(); | |
| cookieName = "notescs-cookie-gdpr"; | |
| cookieValue = "true"; | |
| document.cookie = cookieName + "=" + cookieValue + ";" + expires + ";path=/"; | |
| } | |
| function getCookie() { | |
| cookieName = "notescs-cookie-gdpr"; | |
| var name = cookieName + "="; | |
| var decodedCookie = decodeURIComponent(document.cookie); | |
| var ca = decodedCookie.split(';'); | |
| console.log(ca); | |
| if (ca[0] == "notescs-cookie-gdpr=true") { | |
| return true; | |
| } else { | |
| return false; | |
| } | |
| } | |
| function checkCookie() { | |
| if (!getCookie()) { | |
| // show gdpr code | |
| var getFooter = document.getElementsByTagName('footer')[0]; | |
| let appendString = ` | |
| <div id="gdpr"> | |
| <p>This site uses Google Analytics which uses Cookies. By | |
| using this site you agree to the use of cookies and you acknowledge that you have | |
| read and understood Google's | |
| <a href="https://policies.google.com/privacy">privacy policy</a> | |
| <button class="mdl-button mdl-js-button" onclick="closeAndAccept()"> | |
| Close and Accept | |
| </button> | |
| <p> | |
| </div> | |
| ` | |
| getFooter.innerHTML += appendString; | |
| } | |
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <html> | |
| <head> | |
| <title>GDPR Pop Up Demo</title> | |
| <link rel="stylesheet" href="extra.css"> | |
| </head> | |
| <body> | |
| <p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Sit explicabo error dolores deleniti, omnis rerum placeat eveniet fuga quaerat voluptas mollitia facere ducimus vel! Accusantium fuga quo expedita molestias rerum?</p> | |
| <br> | |
| <br> | |
| <br> | |
| <br> | |
| <br> | |
| <br> | |
| <br> | |
| <br> | |
| <br> | |
| <br> | |
| <br> | |
| <br> | |
| <br> | |
| <br> | |
| <br> | |
| <br> | |
| <br> | |
| <br> | |
| <br> | |
| <br> | |
| <br> | |
| <br> | |
| <br> | |
| <br> | |
| <br> | |
| <br> | |
| <br> | |
| <br> | |
| <br> | |
| <br> | |
| <p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Voluptate, fugiat necessitatibus nostrum incidunt nam ipsa sint. Recusandae, quibusdam ex cumque suscipit, sint mollitia nihil numquam excepturi adipisci dolorum accusamus qui.</p> | |
| <script src="extra.js"></script> | |
| <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons"> | |
| <link rel="stylesheet" href="https://code.getmdl.io/1.3.0/material.indigo-pink.min.css"> | |
| <script defer src="https://code.getmdl.io/1.3.0/material.min.js"></script> | |
| </body> | |
| <footer> | |
| </footer> | |
| <script>checkCookie();</script> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment