Editing social icons - change color and placement for Sparkling theme

Sparkling
1

Hi there,
I’ve got several questions about social icons.

  1. How do I set different colors for each social icon like you do on sidebar of this page?

  2. How do I remove the social icons in footer area?

  3. How do I add social icons in header?

2
  1. Here is how you can change icon background color for Facebook and Twitter icons. You can use the same analogy to change background for other icons as well. You can add this code to Appearance >> Theme Options >> Other >> Custom CSS, just make sure to change color codes to ones that you want to use.
#secondary .widget .social-icons a.facebook {
  background: #F00;
}
#secondary .widget .social-icons a.twitter {
  background: #ff0;
}
  1. You can hide social icons from footer area by adding this simple code to Appearance >> Theme Options >> Other >> Custom CSS
#footer-area .social-icons {
  display: none;
}
  1. This is code that you can use to add social icons anywhere on your website: <?php sparkling_social(); ?> it works only via PHP template files, so in your case you would have to add this code somewhere inside header.php file.
3

thanks! I’ll try it.

4

it worked! thanks a lot!

5

Hi,
is there anyway I can put social icons on navbar? (or should I open a new topic?)

6

—moved to another thread.