W poprzednim poście pisałam o tym, czym są ciasteczka oraz o obowiązku informowania o ich stosowaniu, jakie nanosi na właścicieli blogów polskie prawo. W tym wpisie przejdę (wreszcie, tak, wiem) do spraw czysto technicznych, związanych z działaniem oraz niepoprawnym wyświetlaniem się powiadomienia o ciasteczkach.
Działanie komunikatu o cookies
Co ciekawe, większość powiadomień o ciasteczkach opiera swoje działanie właśnie na technologii plików cookies. Nie inaczej jest z tym komunikatem dostarczanym przez Google. W Bloggerze informacja o potwierdzeniu komunikatu przechowywana jest w ciasteczku pod nazwą displayCookieNotice, którego ważność to rok. Jeżeli nie blog nie był odwiedzany dłużej niż rok, powiadomienie o cookies pojawi się ponownie, ponieważ ciasteczko wygasło.
Aby podejrzeć, jakie ciasteczka są zapisane na danej stronie w przeglądarce (tu na przykładzie Google Chrome), należy uruchomić konsolę Ctrl+Shift+I lub kliknąć Zbadaj w menu otwierającym się po kliknięciu prawym przyciskiem myszy. Następnie przejść w zakładkę Application i w lewym menu z segmentu Storage wybrać Cookies, a potem adres strony.
Jeżeli klikniemy prawym przyciskiem myszy na ciastko displayCookieNotice, możemy wybrać z menu Delete i je usunąć. Wówczas po odświeżeniu strony powiadomienie o cookies pojawi się ponownie.
Uwaga! Nie usuwaj innych ciasteczek przez zakładkę Application. To może spowodować błędy na stronach internetowych.
Usuwanie ciasteczek
Ciasteczka najlepiej usunąć poprzez interfejs przeglądarki, z której korzystasz. Wówczas zostaniesz poinformowany o wszystkich konsekwencjach z tego wynikających (np. wylogowanie z odwiedzanych witryn internetowych).
Jak usunąć ciasteczka w Google Chrome?
Jak usunąć ciasteczka w Firefox?
Blokowanie ciasteczek
Za pomocą przeglądarki można również zablokować zapisywanie plików cookie. W takim przypadku należy jednak pamiętać, że część stron może przez to działać niepoprawnie lub ich funkcje zostaną ograniczone.
Jak wyłączyć pliki cookie w Google Chrome?
Jak wyłączyć pliki cookie w Firefox?
Wszystko jest bardzo !important, czyli koszmarne stylowanie
Domyślne powiadomienie o ciasteczkach do szablonu Bloggera jest dodawane za pomocą skryptu JS. Skrypt ten dodaje również stylowanie. W konsekwencji CSS zapisany z poziomu Bloggera, czy to bezpośrednio w kodzie szablonu, czy przez funkcję Dodaj CSS jest nadpisywany przez CSS dodawany za pomocą JavaScriptu.
Na szczególną uwagę zasługują właściwości:
- background-color;
- color;
- font (w tym font-weight itd.);
- padding;
- margin.
Przy nich niezależnie od selektora należy użyć deklaracji
!important, inaczej nasze style nie będą
widoczne. Przykład stosowania tej deklaracji można zobaczyć
w gotowych stylach komunikatu o cookies, które wcześniej przygotowałam.
Selektory komunikatu o cookies
.cookie-choices-info{} /* główny kontener */
.cookie-choices-inner{} /* wewnętrzny kontener */
.cookie-choices-text{} /* treść komunikatu */
.cookie-choices-buttons{} /* kontener z przyciskami */
.cookie-choices-button{} /* pojedynczy przycisk */
Błędy popełniane przy projektowaniu szablonu związane z powiadomieniem o cookies
Błąd nr 1: zasłonięty komunikat
Bardzo popularnym błędem, który pojawia się w szablonach na Bloggera
niezależnie od ich pochodzenia i ceny, jest
zasłanianie powiadomienia o ciasteczkach w całości lub części
przez menu bloga. Do takiej sytuacji dochodzi, gdy menu jest
pozycjonowane na absolute lub
fixed i jednocześnie wielkość
z-index jest wyższa niż ta dla powiadomienia.
Domyślnie powiadomienie o ciasteczkach dla własności
z-index przyjmuje wartość
4000.
Czujnym należy być przede wszystkim przy wykorzystywaniu tzw. MegaMenu, czyli zewnętrznych rozwiązań opartych na JavaScripcie, które pozwalają na „łatwe” tworzenie wielopoziomowych menu. Tego rodzaju biblioteki są bardzo popularne w zagranicznych motywach na Bloggera, zarówno tych darmowych, jak i płatnych. Na szczęście ten błąd łatwo wychwycić, wchodząc na demo takiego szablonu.
Jak wspominałam w poprzedniej części wpisu o cookies, wyświetlenie pełnej informacji o ciasteczkach jest wymogiem prawnym. Zasłonięcie komunikatu lub uniemożliwienie dokonania zgody zakrawa już o (co prawda nieumyślne, ale jednak) łamanie prawa.
Rozwiązanie A
Jak rozwiązać ten problem? Można albo nadać niższy
z-index w menu, albo wyższy ciasteczkom.
Druga metoda sprawdzi się zwłaszcza przy stosowaniu zewnętrznych bibliotek do
tworzenia menu, bo jego stylowanie może okazać się problematyczne.
.cookie-choices-info{
z-index: 99999 !important; /* lub inny stosunkowo większy od wartości z-indexu menu*/
}
Uwaga! Stylowanie ciasteczek wymaga deklaracji !important. Piszę o tym kilka akapitów wyżej.
Rozwiązanie B
Innym sposobem rozwiązania tego problemu jest przeniesienie komunikatu z góry strony na jej dół. Aby tego dokonać, należy do swojego bloga dodać następujący CSS:
#cookieChoiceInfo {
bottom: 0;
top: auto;
}
Zobacz też: Jak dodać kod CSS na swoim blogu?
Błąd nr 2: dwa komunikaty
Błąd ten jest popełniany, kiedy decydujemy się wykorzystać w szablonie zewnętrze rozwiązanie do informowania o plikach cookie. Łatwo wtedy zapomnieć o usunięciu domyślnego powiadomienia, które kliknęliśmy raz i to jeszcze bardzo dawno temu.
Rozwiązanie
Aby ukryć domyślne powiadomienie o cookies, należy w znaczniku
<head> (najlepiej tuż przed końcowym
znacznikiem </head>) zamieścić poniższy
skrypt.
<script>
cookieChoices = {};
</script>
Całkowite usunięcie powiadomienia (mam przez to na myśli usunięcie pliku JS odpowiedzialnego za dodanie komunikatu do strony) nie jest możliwe. Google dodaje je po swojej stronie, a nie po stronie kodu szablonu. Co prawda ten plik nie jest duży, ale trochę bezsensowne jest zaczytywanie dwóch skryptów do obsługi ciasteczek, by korzystać tylko z jednego. Z tego względu radzę raczej korzystać z domyślnego rozwiązania, zamiast wprowadzać te zewnętrzne, które mogą niepotrzebnie namieszać i sprawić dodatkowe problemy.
Jeżeli powodem wykorzystania zewnętrznego skryptu do obsługi powiadomienia o ciasteczkach był nieciekawy wygląd domyślnego powiadomienia, to już jakiś czas temu przygotowałam gotowe style komunikatu o cookies, które nieco go upiększą.
Zobacz też: Jak dodać skrypt JavaScript na swoim blogu?
Podsumowanie
Bloggerowy komunikat o ciasteczkach, tak jak inne jemu podobne rozwiązania,
opiera się na plikach cookies. W przeglądarkach możemy w prosty sposób
zarządzać ciasteczkami: usuwać je lub blokować. Domyślne powiadomienie o
cookies jest dodawane po stronie systemu Bloggera przez skrypt JavaScript.
Sprawia to między innymi, że zmiana stylowanie tego elementu wymaga deklaracji
!important.
Zdarza się, że komunikat jest nieumyślnie zasłonięty przez menu bloga. Jest to niezgodne z prawem, ale na szczęście ten problem można rozwiązać w prosty sposób. Inna pomyłka to duplikowanie komunikatu przy korzystaniu z zewnętrznej biblioteki obsługującej powiadomienia o cookies. Ponieważ domyślny komunikat o ciasteczkach można jedynie „ukryć”, warto rozważyć pozostanie przy tym rozwiązaniu. Zwłaszcza że istnieje możliwość spersonalizowania powiadomienia zarówno pod względem wyglądu jak i treści.
Mam nadzieję, że wyczerpałam temat ciasteczek i powiem Wam, że już dawno zrobiło mi się od nich zbyt słodko. ;)
Zapraszam jeszcze na mój Instagram @kroltrefl, gdzie jutrzejszym popołudniem na story pojawi się quiz z wiedzy o ciasteczkach. Nie przegapcie go!
Komentarze [0]
Prześlij komentarz