Javascript hozzájárulási popup sütikhez

2015-10-26
7917 megtekintés
Szerző: Basa Bence

Gondolom Önnek is feltűnt, hogy az elmúlt fél évben ijesztő gyorsasággal szaporodnak a Cookie-használati tájékoztatók a weboldalakon. Ezeket persze soha senki nem olvassa el, egyetlen szerepük, hogy amíg nem kapnak jóváhagyást, idegesítően ott lebegnek az oldal egy részén, kitakarva a tartalmat.

Webfejlesztői szemszögből sincs több értelme, főleg az egyszerűbb oldalaknál. A jogi részébe nem szeretnék belemenni (egy Uniós irányelv alapján dolgozták ki ezt a törvényt, részletesebben ebben a blogbejegyzésben szedték össze), a lényeg, hogy egy csupasz HTML oldalon is kell ilyet készíteni, amennyiben bármilyen hirdetési, statisztikai modul megtalálható a forráskódban - például Google Analytics.

Mivel egyre több helyre kell beépítenünk ilyet, úgy gondoltam, készítek egy kis javascript plugint, aminek a segítségével gyorsan el lehet készíteni ezt a popupot (akár programozói ismeret nélkül is). Maga a script pár soros, néhány helyen át kell írni a tartalmakat. Minden szükséges információt a mi szerverünkről tölt le (ez opcionális, le lehet tölteni, módosítani, majd megenni reggelire), tehát semmi plusz beavatkozás nem szüksége - csak be kell illeszteni valahova a weboldal forrásába.

<script type="text/javascript">
    var cookie_popup = (function(){
        var settings = {
            text: "Weboldalunk sütiket használ, hogy növelje a látogatói élményt.",
            url: "cookie-kezeles.html",
            caption: "Bővebben a sütikezelésről",
            button: "OK, elfogadom",
            background: "#7E0D0D",
            color: "white"
        }
        return settings;
    })();
</script>
<script type="text/javascript" src="http://totel.hu/view/js/cookie-popup.js"></script>

Szerintem nem igényel komolyabb magyarázatot. A felhasználása egyszerű: ameddig nem okézzák le (utána létrehoz egy cookiet), meg fog jelenni mindig. A text paraméter a rövid tájékoztatás, az url a cookie hozzájárulási dokumentum URL címe, a caption az előző dokumentumra mutató link szövege, a button az elfogadás gomb felirata, végül pedig két színkód, a background a háttérszín (esetünkben bordó), a color pedig a betű színe.

A mi saját Sütemény Kezelési leírásunk egyébként ezen a linken érhető el