WordPress Tutorial: Adding Social Media Icons to Sidebar Widgets

This WordPress Tutorial shows you how to add social media icons for your sites on Facebook, Twitter, YouTube, LinkedIn into your Sidebar Widgets.

The Black Studio Widget Plugin is Key

Everything is explained in detail in my WordPress video tutorial below.  However, a key component of simplifying the process is using the Black Studio TinyMCEWidget Plugin.   This plugin essentially creates text widgets that you add to your sidebars.  These special text widgets hava all the TinyMCE text editing controls that you have when you create a normal WordPress blog post or page.  Just watch the video and you’ll see exactly what I mean.

Download Your Social Media Icons

Ok, you’ll also need to find and download some cool social media icons to upload to your WordPress website.   A good place to start would be to simply type into Google a phrase like: “free social media icons 2012” and see what websites are listed.   I like to put the year in (currently 2012) so that you end up with the most updated sets of social media icons.

When you click on some of these links, you can be taken to some shady sites.  Be careful.  Some of these sites have links that look like “download icons” links that are really ads or take you to other shady sites.   Some of the sites are in Russian or other foreign languages that look a little suspect.  Try to find a site that is in your native language and that makes it really simple to download the icons.

Don’t Forget to UNZIP

Most icons download as a collection of icons (Facebook, Twitter, YouTube, LinkedIn, etc) in a ZIP file.  My anti-virus program automatically scans such files before opening.  Make sure you scan such files before opening , before unzipping —  using the anti-virus program installed on your computer.   If you don’t know how to UNZIP a file or how to scan a file for viruses, you can search for instructions on YouTube or the site or your anti-virus program. One free program I like for ZIPPING and UNZIPPING files is called 7-ZIP.

Here’s  the link for social media icons that I used in the video:  Softicons.com and here are more Social Media Icons listed on the same site.

This link seems to be another good source for some social media icons at elegantthemes.

Ok, the WordPress Video Tutorial Below should explain all the rest!

Your comments and feedback are greatly appreciated!!!

Meet the Author

Jupiterjim
16 comments… add one
  • Yorinda Nov 20, 2012, 3:14 am

    Hi Jim,
    it is always great to come to your post because I always learn something.
    Even though my theme has the Social Media Widget built into it I very much enjoyed the video, since I learn a few trick.
    The plugin looks good and versatile. Do you use it for other things as well?

    Thank you so much for sharing your knowledge.

    Cheers,
    Yorinda

    • jupiterjim Nov 20, 2012, 11:18 pm

      Yorinda,

      Yes, it’s a great plugin and should be used anytime you need a text widget, not just for social media icons. thanks for sharing!

  • Lydia Brown Nov 21, 2012, 12:14 am

    Jim I just keep getting all the good information from you. The plugins you added to my blog make it look so professional and I like the way Black Studie TinyMCE allows you to be creative. Thanks for your help.

  • Clarkmartin Nov 23, 2012, 3:48 am

    Great post, and very important post. Simple Social Icons and Social Profile Widgets seem to do the same thing and in fact, both are co-authored by Nathan Rice and StudioPress. Does Simple Social Icons supercede Social Profile Widgets?

    Happy to see MySpace was dropped, but so was YouTube. Wish the list of social networks and the ordering could be customizable.

  • marquita herald Nov 23, 2012, 12:45 pm

    Great tutorial Jim – I haven’t had much luck with social media widgets. They always end up looking odd or not aligning the way I want them to. I put a lot of effort into the look of my blog so that’s an issue for me. But you’ve given me some things to think about so I’m going to play around with this a bit more. Thanks!

  • Beverly Knox Nov 24, 2012, 8:43 pm

    Wow this is great especially when you can use it for everyday chatting and not just for social time, it’s a really great widget to use.

  • William Amis Nov 25, 2012, 6:27 pm

    James, I never knew how easy it was to show my global group how to add this widgets without all the junk they show on YouTube. I do not have the time to make a video on how to there are too many of them out there.

    Then I thought about you. I have read so many of your articles and this one just makes sense to my style of coaching. Keep it simple and straight to the point.

    We use only what I created called “Clean Blog”. No need to sale anything and we do not monitize stuff. We give usable information and have lots of interaction on our sites. No, hidden agendas and not freebies. Yet we use a model that I could see giving weekly messages on what is up and coming within our communities.

    We all read hundreds of blogs weekly for update information. You have to keep us with what each week is shaping up as far as what everyone is talking about. You can see the trends. So, your side widget is looks like it may work very well.

    James, I just never got to tell you thank you for all you have done in supporting lots of people in our industry. You are one of our great visionaries and that I respect.

  • Leslie Denning Nov 27, 2012, 10:02 pm

    You have got so much great stuff on your blog, Jim. I can always find out what I need to know. I really love WordPress and am so glad that I have learned how to use it. I use the Social Media Widget that comes with JetPack, and it works very well for me. Thanks for all your great information.

    All the best,
    Leslie

  • Urdu Poetry Dec 2, 2012, 7:19 am

    Great post, and very important post. Simple Social Icons and Social Profile Widgets seem to do the same thing and in fact, both are co-authored by Nathan Rice and StudioPress.

  • Astro Gremlin Dec 2, 2012, 3:51 pm

    Jim, I appreciate your WordPress guidance so much that I linked to it on some early WordPress articles on my blog. Your tutorials are the real deal.

  • Donna Merrill Dec 3, 2012, 6:11 pm

    Hi Jim,

    I love coming to your blog because it is such a great learning experience for me. I am a bit familiar with this plug in, but wasn’t sure how or why to do it. lol

    Thanks for your constant teaching. I sure do appreciate it.

    Donna Merrill

    • jupiterjim Dec 5, 2012, 1:54 am

      Donna,

      Glad you like my stuff. The plugin is highly rated and easy to use! I love your stuff too and recommend it to my blog followers! Thanks for sharing!

  • Web design service Dec 27, 2012, 3:24 pm

    Hey Jim!
    I’d also like to take a moment to share that you can now follow. The buttons that I use in my own sidebar are courtesy of Isa Maria of The Academy. I had been searching high and low for a cute set of icons that included a button to link to my Pinterest,

  • Nile Jan 6, 2013, 4:42 pm

    I have a widget plugin that I put together using the circular icons (different colors of course…lol) I use on my site and only icons that seem most important. I see a lot of people load up any and every social network link they have and they are not always needed.

    Thank you for sharing this tutorial! 😀

    • jupiterjim Jan 19, 2013, 6:33 am

      Nile,

      You are a great designer. We both agree adding too many icons to too many social networks is too many choices for most people. People will end up just NOT clicking on ANY icons. Always love your feedback!

  • Michele Mueller Jan 7, 2013, 7:48 am

    Being a beginning blogger, I don’t really know about many of these features. Having sources to point things out is really great!

Leave a Comment