Support » Plugin: Cookie Notice for GDPR » styling the cookies banner…

  • Hello, I would like to style the banner but cannot as I accepted cookies and now it no longer shows up and so I cannot see what it looks like in order to make changes etc!! Is there a way around this?
    Thank you for a great plugin!!!

    The page I need help with: [log in to see the link]

Viewing 6 replies - 1 through 6 (of 6 total)
  • Hi,

    For starters, this is how it looks now at my end:
    https://snag.gy/kvJ0B3.jpg

    After accepting the cookies, you will not see the bar until the period you set in settings to “remember” the choise of a visitor.

    Set it to a minimum of one day, so it will show up quicker.
    Work arounds are:

    Delete all cached cookies from your browser ( google how to do that ).
    Open an in private window in your browser.

    Hope this helps!
    Annie

    thank you so much, that is very helpful, a perfect answer!!!

    Can you by any chance help me with what css I need to target to change the styling of the banner?? or alternatively, where can i find the css for the buttons and banner?

    thank you!

    Hi,

    You’re welcome!

    Well, in the settings of cookie notice, you are able to chose color of the bar and font.
    Also you have 3 options to give the button another style.
    Did you know that, or do you want more styles options anyway?

    Annie

    Hi,

    If you want some more css styling, you can add this css code into your custimizer> extra css:

    /* Cookie - Leiste */
    #cookie-notice {
    background: rgba(255, 255, 255, 0.9 ) !important; /*Hintergrundfarbe der Leiste*/
    border-top-color: #444; /*Farbe des Rahmens - oben*/
    border-top-style: solid; /*Rahmenart des Rahmens - oben*/
    border-top-width: 4px; /*Dicke des Rahmens - oben*/
    }
    /* Cookie - Button */
    #cookie-notice .button.wp-default {
    background: #f29400; /*Hintergrundfarbe*/
    border-color: #444; /*Rahmenfarbe*/
    color: #fff; /*Schriftfarbe*/
    text-shadow: 0 0px 0 #fff; /*deaktivierung des Schattens bei der Schrift*/
    font-size: 13px; /*Schriftgröße*/
    border-radius: 6px 6px 6px 6px; /*Abrundung der Ecken*/
    -webkit-box-shadow: 0 1px 5px rgba(0,0,0,0.6); /*Schatteneffekt rund um die Buttons*/
    }
    /* Cookie - Button - Hover Effekt */
    #cookie-notice .button.wp-default:hover, #cookie-notice .button.wp-default:focus {
    background: #fff;
    border-color: #444;
    color: #f29400;
    }

    I found it here:https://www.martinkrueber.com/css-anpassung-bei-cookie-notice/ and tested it myself, it works!

    Just play with the different colors to your liking.
    This: background: rgba(255, 255, 255, 0.9 ) the 0.9 at the end stands for transparancy. If you want less adjust to something like 0.5

    Annie

    cielle

    (@cielle)

    Thank you again Annie, that is exactly what I was looking for, you are awesome! Thank you for your time! xx

    LogoLogics

    (@logologics)

    You’re welcome!

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘styling the cookies banner…’ is closed to new replies.