25% off ProSNIPC25OFF

Cookie Consent Banner

Displays a GDPR-friendly cookie consent banner at the bottom of the page; accept/decline state persisted in localStorage.

Module3 parts · by SnipCraft

PHPMarkup

php
<?php
if ( ! function_exists( 'scseed_ccb_footer' ) ) {
    function scseed_ccb_footer() {
        ?>
<div id="scseed-ccb" role="dialog" aria-label="Cookie consent" aria-live="polite" style="display:none;">
  <p class="scseed-ccb-msg">We use cookies to improve your experience. By using our site you consent to cookies.
    <a href="/privacy-policy/">Learn more</a>.</p>
  <div class="scseed-ccb-btns">
    <button id="scseed-ccb-accept" type="button">Accept All</button>
    <button id="scseed-ccb-decline" type="button">Decline</button>
  </div>
</div>
        <?php
    }
    add_action( 'wp_footer', 'scseed_ccb_footer' );
}

CSSStyles

css
#scseed-ccb {
    position: fixed;
    bottom: 0; left: 0; right: 0;
    background: #1c1c2e;
    color: #e2e2e2;
    padding: 14px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    z-index: 99999;
    font-size: 14px;
    line-height: 1.5;
    box-shadow: 0 -3px 16px rgba(0,0,0,.4);
}
.scseed-ccb-msg { margin: 0; flex: 1; }
.scseed-ccb-msg a { color: #7eb3ff; }
.scseed-ccb-btns { display: flex; gap: 8px; flex-shrink: 0; }
.scseed-ccb-btns button {
    cursor: pointer;
    border: none;
    border-radius: 4px;
    padding: 8px 16px;
    font-size: 13px;
    font-weight: 600;
    transition: opacity .15s;
}
#scseed-ccb-accept { background: #4c7ef3; color: #fff; }
#scseed-ccb-decline { background: #3a3a4e; color: #ccc; }
.scseed-ccb-btns button:hover { opacity: .8; }
@media (max-width: 600px) {
    #scseed-ccb { flex-direction: column; text-align: center; }
}

JavaScriptScript

js
(function () {
    var KEY = 'scseed_ccb';
    var bar = document.getElementById('scseed-ccb');
    if (!bar || localStorage.getItem(KEY)) return;
    bar.style.display = 'flex';
    function dismiss() {
        bar.style.display = 'none';
        localStorage.setItem(KEY, '1');
    }
    var acc = document.getElementById('scseed-ccb-accept');
    var dec = document.getElementById('scseed-ccb-decline');
    if (acc) acc.addEventListener('click', dismiss);
    if (dec) dec.addEventListener('click', dismiss);
}());
#frontend#compliance#gdpr#cookie#banner