Tagged: social icons
-
AuthorPosts
-
March 9, 2016 at 10:22 am #595431
Hi – I have read a number of threads on this and the answer seems to have evolved over the years.
How can I make the social icons on the top menu bar (secondary) and the footer always be the hover colors… so Facebook always blue, Pinterest always red etc…?
Thanks
March 10, 2016 at 6:31 am #596070Hi goldengate415!
Thanks for reaching out to us.
I noticed you asked this question in another thread as well but I will also give you the answer here.
To have the background color show for all the icons like the Facebook icon using the CSS code, you have to edit the CSS for each icon separately. So the code for Twitter and Facebook would look like:
#top #wrap_all .av-social-link-twitter a { color: #fff; background-color: ##46d4fe !important; } #top #wrap_all .av-social-link-facebook a { color: #fff; background-color: #37589b !important; }
Doing this for the other icons will require you to know the background color for the icons as well. Let me know if you need further assistance.
Best regards,
JordanMarch 10, 2016 at 8:09 am #596130Hi – yes, I now realize I cross-posted as I added the question onto another thread.
I see this question asked frequently on the forums – perhaps it should be made into a FAQ?
Would it be possible for you to give me the quick css with colors for:
Facebook
Twitter
Instagram
Youtube
Pinterest
Linkedin
Google plus?
I am guessing if you put together one post with all of those that will eliminate a lot of questions…. and is a huge help to me! It would be great if this were an option on the social sharing menu, given how frequently it is asked.
Thanks so much,
Rob
March 10, 2016 at 9:09 pm #596562Hey!
It’s not a problem. Here is the CSS with the color for the icons you requested:
#top #wrap_all .av-social-link-twitter a { color: #fff; background-color: #46d4fe !important; } #top #wrap_all .av-social-link-facebook a { color: #fff; background-color: #37589b !important; } #top #wrap_all .av-social-link-instagram a { color: #fff; background-color: #a67658 !important; } #top #wrap_all .av-social-link-linkedin a { color: #fff; background-color: #419cca !important; } #top #wrap_all .av-social-link-gplus a { color: #fff; background-color: #de5a49 !important; } #top #wrap_all .av-social-link-pinterest a { color: #fff; background-color: #cb2027 !important; } #top #wrap_all .av-social-link-youtube a { color: #fff; background-color: #a72b1d !important; }
Regards,
JordanMarch 11, 2016 at 11:10 pm #597077Thank you very much!!!!!
March 12, 2016 at 3:11 am #597112Hi!
You are most welcome. Glad it worked :)
Best regards,
Jordan -
AuthorPosts
- You must be logged in to reply to this topic.