How to Add Cookie Notice to Your Genesis Website

cookie-notice-genesis.php

//==================================================================================================================== COOKIE NOTICE PLUGIN
// Add Cookie Notice in the footer
add_action('wp_footer', 'custom_cookie_notice');
function custom_cookie_notice() { 
    ?>
    <div id="cookie-notice">
        <p>This website uses cookies to ensure you get the best experience on our website.</p>
        <button onclick="acceptCookie();">Got it!</button>
    </div>

    <script>
        function acceptCookie() {
            document.cookie = "cookieaccepted=1; expires=Thu, 18 Dec 2030 12:00:00 UTC; path=/";
            document.getElementById("cookie-notice").style.visibility = "hidden";
        }

        if (document.cookie.indexOf("cookieaccepted") < 0) {
            document.getElementById("cookie-notice").style.visibility = "visible";
        }
    </script>
    <?php
}

/* Add Cookie Notice in the footer */
#cookie-notice {
color: #fff;
font-family: inherit;
background: #596cd5;
padding: 20px;
position: fixed;
bottom: 10px;
left: 10px;
width: 100%;
max-width: 300px;
box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
border-radius: 5px;
margin: 0;
visibility: visible;
z-index: 9999;
box-sizing: border-box;
}

@media only screen and (max-width: 600px) {
#cookie-notice {
max-width: 100%;
bottom: 0;
left: 0;
border-radius: 0;
}
}