‘Simple Social Icons’ Plugin Tutorial

With the recent update of the Simple Social Icons plugin, I thought it was the perfect time to blog about this little piece of gold. (A few new icons were recently added to the plugin- which makes me very happy =) This is one of my favorite plugins for  many reasons, but mainly for its versatility and customization options. Did I mention that it’s easy to set up too?

Simple Social Icons

Simple Social Icons allows you to add up to 14 of the most popular social media icons to any widgetized area on your wordpress blog or website.  These icons include: Dribbble, Email, Facebook, Flickr, GitHub, Google+, Instagram, Linkedin, Pinterest, RSS, StumbleUpon, Twitter, Vimeo and YouTube. You can customize the size, shape, color, and hover color of the icons as well as the alignment (left, right, centered). Brilliant, right?

setup

1) You can download and install the plugin directly

-or-

From your WordPress dashboard go to Plugins-> Add New. Search for ‘Simple Social Icons’ and install the plugin.

Simple Social Icons

 

2) From your widgets page, drag the Simple Social Icons widget to a sidebar or  widgetized area.

Simple Social Icons | Plugin Tutorial

 

3) Choose, your icon size, border radius, and colors- then add all of your social media links. Click save and view your shiny new icons!

simple-social

What are some of your favorite wordpress plugins?

Comments

  1. says

    Great tutorial! I *love* the Simple Social Icons plugin, and I’m so glad it has Instagram now. I had a ton of clients who wanted it, so as a temporary fix I was just using the Dribbble field and overriding the Dribbble image icon with an Instagram one. SO glad I don’t have to do that anymore. :)

  2. Carol Soderlund says

    I have installed Simple Social Media Icons and I like it very much–except–the email icon won’t work for me. Any hints?

  3. jessyeaibel says

    Hi there. I installed the Simple Social Media Icons plugin, and followed all of the instructions – but it seems like the icon font isn’t showing up in my browser. Instead of social icons, I get little squares as if the font is missing. Is this a setting or something that my current theme is overriding? Any help would be greatly appreciated!! (Screenshot attached).

  4. Helen Schofield says

    Hi again,
    The icon (the font part – so I see just a black square with no symbol) doesn’t show up in my browser if I use Internet explorer, but it seems to work with Google Chrome. I also have the same problem as thepuckburger below i.e. when I click on the email icon, it just links back to the homepage. Am I doing something obvious wrong?
    Thank you for your help!

    • Helen Schofield says

      OK, so both problems seem to have been fixed now. I hadn’t entered my email address in the correct way (mailto:my email address) and as for the other problem in IE, it just took ages to load the image in that browser for some reason – but now I can see it :-)

  5. Tawsha Connell says

    Thank you so much for this tutorial. For the life of me, I couldn’t figure out how to get the icons round. You’ve helped immensely!

  6. says

    Thank you so much for this post Heather! The instructions were very easy to follow and I would have never known how to get the different icon style without it. I used the round buttons (Icon border radius 30px, Icon Size 32PX) you can see them here: http://luckyseventen.com/

    Xo,
    Lucky Seven Ten

  7. corizzo says

    Hi Heather, I’ve been using SSI successfully for about a year. Suddenly, the icons do not change with the widget control. they are teeny tiny. I have contacted the plugin author and they inspected the css and said that the theme is controlling it with:
    .glitter-silver-neonpink .simple-social-icons ul li a {
    background: url("images/social-sprite.png") no-repeat scroll 0 0 #CA006C;
    border-radius: 30px;
    }
    I re-read your tutorial and tried again to make changes to no avail. Can you help me fix this in the theme? http://www.candlequeencandles.com
    thank you!

  8. STEAMPoweredClassrm says

    Just stumbling across this today. I wonder if you can help me – my Pinterest icon in Simple Social Icons doesn’t grab my featured image, but instead just pops up anything it can find on the page (my features image shows up on my main page, not the post itself, so it is omitted as a choice all together). Any tips? I’ve been digging around the php codes for a couple of hours, and surrender!

  9. Dresses and Denim says

    I just installed this plugin and it doesn’t seem to have the bloglovin button. Your examples above all have it. Is there a way I can add it?

Trackbacks

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>