5 sie 2015

PASEK INFORMUJĄCY O CIASTECZKACH - JAK GO UGRYŹĆ?


Dzień dobry! Kilka dni temu Blogspot poczęstował nas powiadomieniem o ciasteczkach. Na każdym blogu pojawiła się informacja o ich przechowywaniu. Dla wielu z Was (również dla mnie) nie było to na rękę, jednak po głębszym zastanowieniu zaczęłam się zgłębiać w jej edycję, bo po prostu nie pasowała do mojego szablonu. W dzisiejszym poście pokażę Wam edycję tego paska w kilku krokach, zapraszam! 


Posiadanie informacji o przechowywaniu ciasteczek na stronie jest obowiązkowa, dlatego jeszcze przed tym wydarzeniem wiele z Was na pewno miało już taką na swoich blogach, a Blogspot ułatwił to całej reszcie, która takowej nie miała. 

JAK USUNĄĆ POWIADOMIENIE O COOKIES?

Najpierw pytanie czy tego chcesz. Jeśli masz już takie powiadomienie u siebie, poniższy krok jest dla Ciebie, jeśli jednak ta informacja dopiero się tu pojawiła polecam przejście do następnego punktu.

Zgodnie z prawem europejskim wydawcy treści cyfrowych muszą informować o wykorzystaniu plików cookie i innych form pamięci lokalnej użytkowników odwiedzających ich witryny i aplikacje. W wielu przypadkach przepisy wymagają uzyskania zgody użytkownika.www.cookiechoices.org

Jeśli chcesz usunąć taką informację zrobisz to za pomocą krótkiego kodu CSS. Wystarczy wejść w Projektant szablonów - Zaawansowane - Dodaj arkusz CSS.

    div#cookieChoiceInfo { 
   display : none !important;
}

 JAK EDYTOWAĆ POWIADOMIENIE O COOKIES?


Standardowe powiadomienie wygląda mniej więcej tak, co nie zawsze pasuje do jasnych layout'ów. W gruncie rzeczy edycja paska jest dosyć prosta, jednak trzeba się nad nią skupić. Jeśli Twoje powiadomienie już zaakceptowałaś/eś i nie pojawia się nadal to spróbuj zrobić to w trybie incognito!

Selektor paska informacyjnego
div#cookieChoiceInfo {
        background-color : #fff !important;   -Kolor tła paska
        color : #000!important;  -Kolor fonta
        font-size : 14px;  -Rozmiar fonta
        font-family : sans-serif;  -Rodzaj fonta
}


Selektor przycisku "Dowiedz się więcej"
#cookieChoiceInfo a{
        background-color : #555 !important;  -Kolor tła przycisku
        font-size : 12px;  -Rozmiar fonta
        color : #585858;  -Kolor fonta
        font-weight : normal;  -Grubość fonta
        border-radius : 6px;  -Zaokrąglenie rogów
}

Selektor przycisku "Rozumiem" 
#cookieChoiceInfo > a:nth-child(2), a#cookieChoiceDismiss {
        background-color : #555 !important; -Kolor tła przycisku
        color : #fff;  -Kolor fonta
        font-family : sans-serif;  -Rodzaj fonta
        font-size : 14px;  -Rozmiar fonta
        font-weight : normal;   -Grubość fonta
        border-radius : 6px;  -Zaokrąglenie rogów
}

Wyróżnione fragmenty możesz dowolnie zmieniać. Czcionki wybieraj z listy Blogspota. Pamiętaj, żeby dwuczłonowe nazwy oddzielać pauzą, bez spacji.

PRZYKŁADOWY KOD



div#cookieChoiceInfo {
        background-color :  #fff !important;
        color : #000!important;
        font-size : 14px;
        font-family : sans-serif;
        border-bottom : 1px solid #ddd;
        font-weight : normal;
        border-radius : 0px;
}


#cookieChoiceInfo > a : nth-child(2),a#cookieChoiceDismiss {
        color : #fff;
        font-family : sans-serif;
        font-size : 14px;
        font-weight : normal;
        border-radius : 0px;
}


#cookieChoiceInfo > a : nth-child(2) : hover, a#cookieChoiceDismiss : hover {
        color : #fff !important;
        font-weight : normal;
        border-radius : 0px;
}


#cookieChoiceInfo a{
        background-color :  #262626 !important;
        color : #fff !important;
        font-size : 14px;
        font-family : sans-serif;
        border-bottom : 1px solid #ddd;
        font-weight : normal;
        border-radius : 0px;
}


#cookieChoiceInfo > a : nth-child(2),a#cookieChoiceDismiss {
        color : #fff;
        font-family : sans-serif;
        font-size : 14px;
        font-weight : normal;
        border-radius : 0px;
}


#cookieChoiceInfo > a : nth-child(2) : hover, a#cookieChoiceDismiss : hover {
        color : #000 !important;
        font-weight : normal;
        border-radius : 0px;
}


JAK PRZESUNĄĆ PASEK?

Pasek w tym miejscu często zasłania nagłówek. Można go przesunąć na dół przy użyciu tego kodu:

div#cookieChoiceInfo {
        top : 90% !important;
}



To by było na tyle w dzisiejszym poście. Miałam w planie napisać o tym jak spersonalizować tekst tego powiadomienia, jednak nie jestem pewna, czy komuś by się to przydało. Sama wybrałam standardową opcję, ponieważ jest ona automatycznie tłumaczona na inne języki. Jeśli jednak ktoś chciałby dowiedzieć się jak to zrobić możecie śmiało do mnie pisać! Trzymajcie się ciepło i do następnego.

38 komentarzy:

  1. Post meega przydatny! Bardzo fajne sposoby bo przecież nie każdemu odpowiada czarny pasek o plikach cookies
    Pozdrawiam :*
    zazustreet.blogspot.com

    OdpowiedzUsuń
  2. Bardzo pomocny post :). Pozdrawiam!

    lublins.blogspot.com

    OdpowiedzUsuń
  3. Przydatny post :)
    nataliapfotografia.blogspot.com

    OdpowiedzUsuń
  4. Bardzo przydatny post chętnie skorzystam :D

    Pozdrawiam, OSIA WWW.OSIAOSIA.BLOGSPOT.COM (klik)

    OdpowiedzUsuń
  5. mega przydatne, dzięki! :)
    siwusi.blogspot.com

    OdpowiedzUsuń
  6. Przydatne i zrobię sobie taką edycje paska ale dziś już za późno na takie wyzwania dla mnie ;P Świetny post ;)
    Zapraszam na blog-estery.blogspot.com <=== KLIK!

    OdpowiedzUsuń
  7. Bardzo przydatny wpis, w sumie nie zastanawiałam się nad zmianami w tym zakresie, zostawiłam jak było :)

    OdpowiedzUsuń
  8. fajny poradnik
    http://oliwialiv.blogspot.com/

    OdpowiedzUsuń
  9. Na pewno się przyda ten wpis:)

    OdpowiedzUsuń
  10. Przydatny post, na pewno skorzystałabym z Twoich rad, gdyby nie to, że już kilka dni temu zainstalowałam gotowca znalezionego w internecie, który wygląda u mnie lepiej, niż ten blogspotowy pasek :)
    TeoriaKobiety.pl

    OdpowiedzUsuń
  11. Zdecydowanie się przyda, zrobię mojemu paskowi nieco nieprzeźroczystości. :D

    OdpowiedzUsuń
  12. Świetne kody, zwłaszcza, że te okienka nie zawsze wyglądają tak, jak byśmy chcieli :)
    via-martyna.blogspot.com

    OdpowiedzUsuń
  13. kocham bawić się kodami :D
    mogłabym liczyć na wejście w banner cndirect/dresslink u mnie na blogu?:) Mój Blog - klik! każdy komentarz, oraz obserwację oddaję!

    OdpowiedzUsuń
  14. koniecznie muszę tego spróbować !

    flawlessbananaa.blogspot.com

    OdpowiedzUsuń
  15. Na pewno skorzystam bo do mojego wyglądu również nie pasuje ten pasek :(

    Jull Blooog - klik!

    OdpowiedzUsuń
  16. Przydatne, ja nie mam zamiar tego zmieniać ponieważ u mnie pasuje idealnie. To jest własnie zaleta bloga czarnego jak górnik po robocie :) Zapraszam na Kamienne Oblicze - KLIK

    OdpowiedzUsuń
  17. Bardzo przydatnie :). Normalny pasek jest okropny, ale nawet mi do głowy nie przyszło, że da się go zmienić. Dzięki!

    OdpowiedzUsuń
  18. super, że jednak można go zmienić! Koniecznie w wolnej chwili muszę się za to zabrać :)

    OdpowiedzUsuń
  19. Przydatne i bardzo fajnie sie to u Ciebie prezentuje

    Buziak

    OdpowiedzUsuń
  20. Super pościk! Ja też bawię się kodami i trochę też tworzę coś :) Powodzenia życzę.
    sotiens.blogspot.com

    OdpowiedzUsuń
  21. Bardzo fajny patent bardzo przydatny

    OdpowiedzUsuń
  22. Ostatnio właśnie tego szukałam! Dziękuję Ci za ten post, bo niebawem muszę z niego skorzystać :)

    Pozdrawiam ♥,
    yudemere

    OdpowiedzUsuń
  23. Dziękuję za patent na usunięcie tego powiadomienia! :)

    NOWY POST NA FABRYCE MIĘTY KLIK! :))

    OdpowiedzUsuń
  24. Na pewno przy się to wielu osobom <3
    http://sapphireblog1.blogspot.com/ -----> Zaobserwuj! ♥

    OdpowiedzUsuń
  25. Nice blog sweetie :)

    Follow me on GFC, I always follow back.

    WWW.HEKYMA.COM

    OdpowiedzUsuń
  26. Spadłaś mi z nieba z tym postem! Dziękuję Ci z całego serca!
    Już miałam dość klikania bez końca "rozumiem" :'))
    Świetny i mega przydatny post!
    Obserwuję,

    justsayhei.blogspot.com

    OdpowiedzUsuń
  27. mnie to jakoś nie denerwuje, ale zastanawiałam się czy tylko u mnie to wyskakuje ahaha :D
    http://karik-karik.blogspot.com/

    OdpowiedzUsuń
  28. Perfect photos, I love it! Keep going! ✿
    Follow for follow? Let me know, I always follow back! ✿

    Izabella | MY BLOG /klik/

    OdpowiedzUsuń
  29. Bardzo przydatny post, dziękuje:)
    http://aaaniiaaa.blogspot.com/

    OdpowiedzUsuń
  30. Bardzo przydatny post! Dzięki! Planuję u siebie z tym paskiem zawalczyć, żeby trochę ładniej wyglądał, przyda mi się Twój tutorial :)

    OdpowiedzUsuń