[mlw5137]

Hello,

Here is my webiste: trekkingitout.com

What I am trying to do:

1.) Have the social links appear *above* the header, not below.

2.) Have the Social Links appear with color. I only see color when I hoover my mouse over them. However, I am curious if I can have them in color without having to hoover the mouse over them.

Thanks so much in advance,

Mike

[Sakin]

@mlw5137:

1. You can add the Social Widget to “Header Top Sidebar” from “Appearance => Widgets”. But this option is there only in Catch Everest Pro theme.

2. To make the social icon appear with color, add the following CSS in “Appearance => Theme Options => Custom CSS” box.

ul.social-profile li.facebook a { background-position: 0 -43px; }
ul.social-profile li.twitter a { background-position: -44px -43px; }
ul.social-profile li.google-plus a { background-position: -173px -43px; }
ul.social-profile li.pinterest a { background-position: -216px -43px; }
ul.social-profile li.flickr a { background-position: -431px -43px; }

[mlw5137]

Thank you so much. Is there a reference for the CSS regarding the default colors for the other social icons? Just so I have it when I expand my social media further and wish to add more links?

Thanks Sakin!

[Sakin]

@mlw5137: You have to add -43px in all social icons css.

[tracypie]

Can you put the social icons above the header for the Catch Box Pro theme?
http://kickinitinkindergarten.com/

[Sakin]

@tracypie: Yes you can . You can add the Social Links widgets in your Header Top Sidebar from “Appearance => Widgets”.

[mlw5137]

@Sakin,

I am adding Instagram to my social links and put the following css in:

ul.social-profile li.facebook a { background-position: 0 -43px; }
ul.social-profile li.twitter a { background-position: -44px -43px; }
ul.social-profile li.google-plus a { background-position: -173px -43px; }
ul.social-profile li.pinterest a { background-position: -216px -43px; }
ul.social-profile li.flickr a { background-position: -431px -43px; }
ul.social-profile li.instagram a { background-position: -860px -43px; }

The colors and positioning worked. However, I can no longer see the Instagram icon unless I hoover my mouse over it. Any thoughts?

Thank you very much,

[Sakin]

@mlw5137: For instagram it should be as below.
ul.social-profile li.instagram a { background-position: -775px -43px; }

[cavino]

for anyone wondering, youtube is:

ul.social-profile li.you-tube a { background-position: -87px -43px; }

[Lovetoreadread]

Can anyone PLEAS post tumblr and if you have goodreads to it would be awesome. Tried everything but can’t get tumblr to work it’s driving me nuts.
my blog is http://www.readread.net

[Sakin]

@Lovetoreadread: You can add the following css in “Appearance => Theme Options => Custom CSS” box:

ul.social-profile li.tumblr a { background-position: -646px -43px; }
ul.social-profile li.goodreads a { background-position: -989px -43px; }

[Alex GR]

First of all Ι wish you courage to overcome the disaster in your country.

Relative to the above issue, which is the CSS to make visible in colors “slideshare” ?

Alex

[Sakin]

@Alex GR: Thanks.

For slide share, you can add the following css in Appearance => Theme Options => Custom CSS” box:

ul.social-profile li.slideshare a { background-position: -259px -43px; }

[Author]

Posts