Support » Plugin: Simple Social Icons » Colors Won't Change – Tried adding code to CSS

  • Resolved dv8


    Colors wouldn’t change by editing them in the widget area. So I added code to the CSS file. Still didn’t do anything. Obviously I’m not doing something right.

    Here’s the code I added to my CSS file…

    .simple-social-icons .social-facebook a:hover {background-color: #3D699E !important;}
    .simple-social-icons .social-flickr a:hover {background-color: #fc0589 !important;}
    .simple-social-icons .social-gplus a:hover {background-color: #dd4b39 !important;}
    .simple-social-icons .social-instagram a:hover {background-color: #406e94 !important;}
    .simple-social-icons .social-linkedin a:hover {background-color: #1b86bc !important;}
    .simple-social-icons .social-pinterest a:hover {background-color: #ca2027 !important;}
    .simple-social-icons .social-rss a:hover {background-color: #f38f36 !important;}
    .simple-social-icons .social-twitter a:hover {background-color: #00abf0 !important;}

    Do I have to add something to the beginning of the code?

    Thanks in advance.

Viewing 10 replies - 1 through 10 (of 10 total)
  • Nevermind. I fixed it. It was a simple, dumb, mistake.

    Carry on.

    Hey, quick question: I edited my CSS and got the hover colors to change, but now I want to change the normal background color (from the standard gray to a light brown) – any idea how to do that?

    My site is:

    ok i just did the same thing – posted this and then figured it out two seconds later! lol here’s my solution for anyone else looking:

    .simple-social-icons .social-facebook a {
        background-color: #99cc00 !important;
    .simple-social-icons .social-facebook a:hover {
        background-color: #a69c91 !important;
    Andrea Rennick


    Customer Care at Copyblogger Media and Studiopress

    Just a reminder the widget has a setting for this. 🙂

    Yeah, it doesn’t work for me when I change it in the widget settings.

    I’m with dv8. The last time I tried using this plugin, the settings in the widget don’t work. Once you set them you’re stuck with those colors… changes are ignored. I remember this from using it some time back.. and then tried again today… the changes don’t stick in this current version either. What gives?

    Plugin Author Ron Rennick


    Once you set them you’re stuck with those colors… changes are ignored.

    My first guess would be caching.

    I just tried to modify the colors through the widget and tested it from another computer and it wouldn’t work either. It’s not a caching issue. It doesn’t work. Perhaps it doesn’t work with the Genesis Framework? I will try modifying the CSS as listed above. But it would be nice if the developer fixed this. Seems pretty simple.

    Hi there.

    I’m having the same problem – can’t change the widget settings once they’ve been set the first time… It seems that any changes after the plugin is first configured are ignored. What gives?

    I also can’t edit my stylesheet because the plugin seems to be inserting some inline styles right before the close head tag </head> with !important, so anything I add is getting overwritten by those styles. 🙁

    Can you please confirm if this code is coming from the plugin – though I think it is as I see the same styles right before the </head> on the plugin authors site 🙂 – view-source:

    I too am using a Genesis child theme and have cleared the cache and everything else I can think of.

    How can we get the plugin settings to work again?

    LOL – oops – my bad… The customer I was working with had another simple social icons widget buried in a custom sidebar… It was overriding the changes to the first widget. #BLUSHINGNOW

Viewing 10 replies - 1 through 10 (of 10 total)
  • The topic ‘Colors Won't Change – Tried adding code to CSS’ is closed to new replies.