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

  • cielle

    (@cielle)



    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)
  • LogoLogics

    (@logologics)

    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

    cielle

    (@cielle)

    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!

    LogoLogics

    (@logologics)

    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

    LogoLogics

    (@logologics)

    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)
  • You must be logged in to reply to this topic.