WordPress.org

Support

Support » Plugins and Hacks » Simple Social Icons » [Resolved] Colors wont change

[Resolved] Colors wont change

Viewing 13 replies - 1 through 13 (of 13 total)
  • Paul

    @armstrong698

    Never mind I altered the default values in simple-social-icons.php in order to achieve the colour change.

    Paul

    @armstrong698

    Resolved

    A. I love that you solved this forum question yourself haha

    B. How the hell did you get those colors to change, I went into the php file and it seems the defaults still override my changes?

    Thanks!

    Hi BritneyMuller – as a start, try something like this in your child theme style.css (I spotted this on another site) –

    .simple-social-icons .social-facebook a:hover {background-color: #4965a0 !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;}

    photoMaldives, I used your provided coding and put it in my style.css, which changed the hover color to correspond with each social media site’s color (ex: twitter is the iconic twitter blue, pinterest is red), but the background color still hasn’t changed. Is there a way that I can change the background color of each icon to match the hover color that’s currently in place?

    home page: http://thecommunaltable.net

    Hi thecommunaltable

    Do you want the icons to have colour all the time, and not just when hovered over ? If so, just use the same code as above, but remove the a:hover from each line. Then you can edit the colours as you wish – both ‘at rest’ and ‘on hover’ for each icon.

    (Tip : a very useful tool to quickly get the color you want is Instant Eyedropper, which sits in your system tray and lets you click any color anywhere on your screen, and copies it to clipboard.)

    Hope that helps.

    prayersnapples

    @prayersnapples

    Worked great on the hover colors 🙂 Thanks! Now I want to change the default background color (from the standard gray to a light brown). I figured I probably just need to add something else into that style sheet, but I wasn’t sure what lol

    prayersnapples

    @prayersnapples

    (Sorry to bother everyone!) I just figured it out after playing around a lil:

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

    @thecommunaltable

    HI,

    I just deleted the a: hover from the coding, but it still shows the background as grey and only changes color when you hover over each icon…

    prayersnapples

    @prayersnapples

    make sure you leave the letter ‘a’ there in the first part (just delete the : hover). I used the exact code above (in my last reply) on my homepage (the four circles in the middle) and it worked nicely: http://prayersandapples.com. Hope this helps!

    Hello,
    I am fairly new to wordpress.org, css and simple social.
    I have a
    1) custom theme from studio press
    2) downloaded simple-social widget
    3) installed simple social in header and set up urls

    Can you please tell me the steps I need to take to change the simple-social-icons from the default gray color to the colored social media icons?

    Your detailed steps are greatly appreciated.
    Mikki

    Andrea Rennick

    @andrea_r

    Customer Care at Copyblogger Media and Studiopress

    Go to Appearance -> Widgets.

    Find the widget you added. pop it open.

    Fill in the css hex color to the colors you want.

    Andrea Rennick that’s beautiful! Doh!

Viewing 13 replies - 1 through 13 (of 13 total)
  • The topic ‘[Resolved] Colors wont change’ is closed to new replies.
Skip to toolbar