Can't get social network icons to show

[Marlean Tucker]

Hi,

I just installed the “Live” theme today and can’t figure out how to get the social media icons to show next to the navigation bar. I don’t see anywhere in the theme options to input the url’s for social networks. Thanks in advanced for your help. ~Marlean

[Bill Robbins]

Marlean,

Great question about the social media icons. There’s a section in the theme instructions under Navigation Menus that explains how to add them. Unlike some of our other themes, they are actually part of the navigation menu. If you have any trouble adding them, just let me know.

Thanks and enjoy your Sunday,
Bill

[Marlean Tucker]

Thank you!! I love that you wer so prompt in responding. Another quick question. Do you have any suggestions for a nice java photo gallery (plugin) that would work with the responsive design?

Thanks

Marlean

[Bill Robbins]

Marlean,

I do try to be quick in answering questions. Unanswered questions in the queue just eat at me.

For a lightbox plugin, you might try Ligthbox Plus. It works with WordPress’ built in gallery which is the best way to go. Just make sure you select for the thumbnails to link to the “file” and not the “attachment page” when inserting the gallery (there’s an option to select that when you create the gallery).

If you have any trouble, just let me know,
Bill

[Ben Coleman]

There’s no “CSS Classes” field on my custom menu dialog box. How can I add the Facebook icon?

thanks!

[Bill Robbins]

Ben,

Click on screen options in your menu builder (Appearance > Menu) and make sure the box next to “CSS Classes” is checked. That should add the box for you.

WordPress likes to hide many things by default. As a good rule of thumb, if you can’t find an input box that should be there, it may be hidden in the screen options.

If you have trouble, let me know,
Bill

[Kevin Sandlin]

The social network icons are white only, so because I’ve changed my LIVE header background to white, these icons are invisible. How can I change them to black or another dark color?

[Bill Robbins]

Kevin,

I just sent you an email about that. Here are the instructions in case in one in the forum needs them.

1. Save this image to your desktop:
   
2. To use them, you can go to the Media section of your WordPress library and select “Add New.”
3. Upload the image and then select edit. In the right hand column of that screen you’ll see a field labeled “file URL.” Copy that URL.
4. Next go to the theme options page and select the styling tab. Scroll down to the Custom CSS box and paste this:

   
   #navigation li.dribbble a,
   #navigation li.facebook a,
   #navigation li.flickr a,
   #navigation li.foursquare a,
   #navigation li.forrst a,
   #navigation li.google a,
   #navigation li.linkedin a,
   #navigation li.pinterest a,
   #navigation li.twitter a,
   #navigation li.youtube a,
   #navigation li.vimeo a,
   #navigation li.yelp a,
   #navigation li.podcast a,
   #navigation li.rss a {
        background: url(https://yoursite.com/image.png) no-repeat;
   }
   
   #navigation li.dribbble a {
   	background-position: 0 -430px;
   }
   
   #navigation li.facebook a {
   	background-position: 0 -3px;
   }
   
   #navigation li.flickr a {
   	background-position: 0 -33px;
   }
   
   #navigation li.foursquare a {
   	background-position: 0 -88px;
   }
   
   #navigation li.forrst a {
   	background-position: 0 -61px;
   }
   
   #navigation li.google a {
   	background-position: 0 -117px;
   }
   
   #navigation li.linkedin a {
   	background-position: 0 -148px;
   }
   
   #navigation li.pinterest a {
   	background-position: 0 -206px;
   }
   
   #navigation li.twitter a {
   	background-position: 0 -263px;
   }
   
   #navigation li.youtube a {
   	background-position: 0 -361px;
   }
   
   #navigation li.vimeo a {
   	background-position: 0 -296px;
   }
   
   #navigation li.yelp a {
   	background-position: 0 -328px;
   }
   
   #navigation li.podcast a {
   	background-position: 0 -464px;
   }
   
   #navigation li.rss a {
   	background-position: 0 -235px;
   }
   
   

5. Just replace the http://yoursite.com/image.png with the URL to the image you copied earlier.
6. Update your settings.

That should replace the white icons with black ones.

If you have any questions or trouble, let me know,
Bill

[Author]

Posts