[abisbee]

Hi. I am now using the CT: Social Icons widget. The icons are gray though, and the colorful icons only show on hover. Can I swap this so the colorful icons display on the page and the gray is only on hover?

Also, is there a way to change from gray to another color?

Thank you.
Alice

[sapana]

@abisbee:It is a bit difficult to change in theme, you need to customize it. Instead of that I suggest you to use the Catch Web Tools, Social Icon feature where you can change the social icon color as per your need. let me know if you find any difficult while using the plugin.

Kind Regards,
Sapana

[abisbee]

Thanks, Sapana, but I’d prefer to use CSS, if possible. Can you help with this?

[sapana]

@abisbee: You need to change in core code, so I suggest you to hire a customizer to get it done.

Kind Regards,
Sapana

[abisbee]

Thank you for your advice. Have a good day

[sapana]

@abisbee:Hello abisbee, Can you try this css code and let me know if this works out!
Go to=> Appearance=> Customize=> Additional CSS=> add the following css code

.site .widget_catchresponsive_social_icons a.genericon-facebook-alt {
    background-color:#3b5998;
    border-color:#3b5998;
    color:#fff;
}
.site .widget_catchresponsive_social_icons a.genericon-twitter {
    background-color:#00aced;
    border-color:#00aced;
    color:#fff;    
}
.site .widget_catchresponsive_social_icons a.genericon-mail {
    background-color:#1d62f0;
    border-color:#1d62f0;
    color:#fff;
}
.site .widget_catchresponsive_social_icons a.genericon-youtube {
    background-color:#bb0000;
    border-color:#bb0000;
    color:#fff;
}
.site .widget_catchresponsive_social_icons a.genericon-instagram {
    background-color:#517fa4;
    border-color:#517fa4;
    color:#fff;
}

.site .widget_catchresponsive_social_icons a.genericon:hover {
    background-color: #d7d7d7;
    border: 1px solid #b6b6b6;
    color:#777;
}

Kind Regards,
Sapana

[abisbee]

Absolutely PERFECT! Thank you, Sapana!

[Author]

Posts