w3collective/cookie-track-returning-visitor.html

## cookie-track-returning-visitor.html
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>Hello World</title>
    <style>
      body {
        margin: 0;
        font-family: sans-serif;
      }
      #welcome {
        position: fixed;
        bottom: 0;
        width: 100%;
        padding: 10px 0;
        background: rgb(14, 108, 170);
        color: #fff;
        text-align: center;
      }
      #welcome a {
        color: #fff;
      }
    </style>
  </head>
  <body>
    <script>
      document.addEventListener("DOMContentLoaded", function () {
        const userCookieName = "returningVisitor";
        checkUserCookie(userCookieName);
      });

      function checkUserCookie(userCookieName) {
        const cookieExists = document.cookie.match(userCookieName);
        if (cookieExists != null) {
          document.body.insertAdjacentHTML(
            "beforeend",
            '<div id="welcome">Welcome back friend! Check out our latest thing <a href="#">HERE</a></div>'
          );
        } else {
          createUserCookie(userCookieName);
        }
      }

      function createUserCookie(userCookieName) {
        const userCookieValue = "Yes";
        const userCookieDays = 7;
        let expiryDate = new Date();
        expiryDate.setDate(expiryDate.getDate() + userCookieDays);
        document.cookie =
          userCookieName +
          "=" +
          userCookieValue +
          "; expires=" +
          expiryDate.toGMTString() +
          "path=/";
      }
    </script>
  </body>
</html>