• Skip to main content
  • Skip to forum navigation

StudioPress

  • Shop for Themes
  • My StudioPress

Forum navigation

  • Home
  • General Genesis Discussions
  • StudioPress Themes
  • Genesis Blocks
    • Genesis Blocks
    • Genesis Custom Blocks
  • Retired Themes
  • FAQs
  • Forum Rules
  • Internationalization and Translations
  • Forum Bugs and Suggestions
  • Forum Log In

Are You Using The WordPress Block Editor?

Genesis now offers plugins that help you build better sites faster with the WordPress block editor (Gutenberg). Try the feature-rich free versions of each plugin for yourself!

Genesis Blocks Genesis Custom Blocks

Simple Social Icons – Changing individual icon color

Welcome!

These forums are for general discussion on WordPress and Genesis. Official support for StudioPress themes is offered exclusively at My StudioPress. Responses in this forum are not guaranteed. Please note that this forum will require a new username, separate from the one used for My.StudioPress.

Log In
Register Lost Password

Community Forums › Forums › Archived Forums › General Discussion › Simple Social Icons – Changing individual icon color

This topic is: not resolved

Tagged: simple social icons

  • This topic has 5 replies, 2 voices, and was last updated 9 years, 4 months ago by Patrick.
Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • November 11, 2013 at 10:48 am #72319
    Patrick
    Member

    Hi, does anyone know if there is a way to change the color and hover color of each icon individually for Simple Social Icons? That is, I'd like each icon to be its traditional colors instead of all being the same color.

    Thank you!

    http://officeliberator.com
    November 11, 2013 at 9:29 pm #72427
    Brad Dalton
    Participant

    In the widget settings this can be done. Simply change the hex color codes.


    Tutorials for StudioPress Themes.

    November 11, 2013 at 10:16 pm #72431
    Patrick
    Member

    I only see a way to change all the icons the same color, I'm trying to change the color of each individual icon. Unless I'm missing something. Could you be more specific? Thanks!

    November 12, 2013 at 12:39 am #72440
    Brad Dalton
    Participant

    Add this to your child themes style.css file and change the hex color codes:

    .simple-social-icons .social-facebook a:hover {
        background-color: blue!important;
    }
    

    Rinse and repeat for each button:

    .simple-social-icons .social-twitter a:hover {
        background-color: blue!important;
    }
    

    Tutorials for StudioPress Themes.

    November 12, 2013 at 1:08 am #72443
    Brad Dalton
    Participant

    Here's more on the topic http://wpsites.net/best-plugins/change-simple-social-icons-background-hover-color/


    Tutorials for StudioPress Themes.

    November 12, 2013 at 2:01 pm #72544
    Patrick
    Member

    That did it! Thank you!

  • Author
    Posts
Viewing 6 posts - 1 through 6 (of 6 total)
  • The forum ‘General Discussion’ is closed to new topics and replies.

CTA

Ready to get started? Create a site or shop for themes.

Create a site with WP EngineShop for Themes

Footer

StudioPress

© 2023 WPEngine, Inc.

Products
  • Create a Site with WP Engine
  • Shop for Themes
  • Theme Features
  • Get Started
  • Showcase
Company
  • Brand Assets
  • Terms of Service
  • Accptable Usse Policy
  • Privacy Policy
  • Refund Policy
  • Contact Us
Community
  • Find Developers
  • Forums
  • Facebook Group
  • #GenesisWP
  • Showcase
Resources
  • StudioPress Blog
  • Help & Documentation
  • FAQs
  • Code Snippets
  • Affiliates
Connect
  • StudioPress Live
  • StudioPress FM
  • Facebook
  • Twitter
  • Dribbble