Tipsy Social Icons Plugin For WordPress

This version is a major update but if you're interested in skipping most of the information, jump down to what's new in this version.

Tipsy Social Icons In January 2011, Atlanta was hit with a major snow storm that had many of us hanging out inside of our homes for days at a time. To say that I had cabin fever would be an understatement.

During that time, I wrote a really simple social icons plugin for WordPress. Because I used Jason Frame’s excellent jQuery plugin called Tipsy, I aptly named the plugin Tipsy Social Icons.

Since it was first released, I’ve done much more WordPress development and this plugin wasn’t up to par with my usual standards, so I’m updating it and am officially releasing Tipsy Social Icons 3.0.

About Tipsy Social Icons

Tipsy Social Icons is a simple WordPress widget that makes it easy to include a variety of social icons and custom labels into your WordPress blog or site.

It includes both 16×16 and 32×32 variations of the icons as well as optional hover effects. It allows you to:

  • Define a custom URL for each image
  • Easily customize each icon’s label
  • Modify the placement of the tooltips
  • Select which size icon you’d like to use
  • Is fully localized for translation
  • …and more

The plugin includes icons for:

  • Deviant Art
  • Digg
  • Dribbble
  • Email
  • Evernote
  • Facebook
  • Flickr
  • Forrst
  • FourSquare
  • GitHub
  • Google+
  • LastFM
  • LinkedIn
  • Picasa
  • Pinterest
  • Rdio
  • RSS
  • Skype
  • Soundcloud
  • Stack Overflow
  • Tumblr
  • Twitter
  • Vimeo
  • Yelp
  • YouTube

You can install the plugin from the WordPress Plugin’s Dashboard or from the project’s page.

As always, I’m open to suggestions, questions, and comments. Feel free to leave a comment or shoot me an email.

What’s New in 3.0?

Tipsy Social Icons 3.0 includes a number of major improvements:

  • The entire administration interface has been improved
  • I’ve brought the codebase up to the WordPress Coding Standards
  • Introduced placeholder text for each social icon field
  • The CSS and JavaScript has been combined minified in order to decrease the number of dependencies when the browser loads the plugin
  • Tooltips can now be completely disabled
  • I removed the Posterous icon
  • I added icons to Evernote, GitHub, Picasa, Rdio, Stack Overflow, Stumble Upon, Yelp, and ZooTool
  • The screenshots have been updated as well as the plugin header image

For more information, be sure to check out the documentation at the plugin’s page in the WordPress Plugin’s Repository.

Donations: If you’ve enjoyed using this plugin, please consider making a donation!

Note: Many of the icons are based on Rogie King’s excellent social networking icon pack. The license for the plugins is bundled with the plugin.

Thanks to Branco for the Slovak translation!

48 Replies to “Tipsy Social Icons Plugin For WordPress”

    1. Hey Monica,

      For LinkedIn, the URL should be and that should work (I just tested it myself) and it look me to the right place.

      The email field is meant to have your email address so if you place that into the box, it should generate a link that, when clicked, opens a visitor’s email application.

      Try those and let me know!

      1. Thanks so much Tom, the LinkedIn url worked perfectly! I’m still having trouble with the e-mail, it takes me to a blank page. I’m sure it’s something I’m doing incorrectly…my email is…is that what I should be putting in?
        I thought the “envelope” button was a subscribe by e-mail button, is that available?

        Thank you so much for your help!

        1. For this plugin, “Subscribe By Email” isn’t an option, but JetPack offers this and it lets you setup a nice widget to manage it.

          Back to the envelope icon, try this: Instead of just putting in your email address, drop this in the field:

          And see if that doesn’t have the effect you’d like.

          Let me know!

          1. Hi Tom,

            No, still didn’t work…takes you to a blank page. Maybe I’ll just have to remove the envelope. Thanks for your help…I’m off to check out JetPack, thanks for the link.

          2. Gotcha – this is one of those things that has to do with a user’s specific browser configuration and their email client so different people see different results.

            Anyway, good luck with JetPack and thanks for the comments!

    1. Hey Cathy – not likely. It’s such a niche site that I’m sure sure many people would use it, but I could be wrong! If enough people request it, I’d be happy to add it!

  1. Hey Tom. I’m having a real difficult time getting the links to work. Ive double checked the url adresses i’ve inputted in the sidebar in a separate tab and they work, however, the buttons on my footer (where I’m using your plugin) aren’t working.

  2. Hey tom
    I just instal the plugin and i would like to add the rss feed. But which url do i need to add this?
    I hope you can read this because my english isn’t so good.


    1. Sure thing, Matt.

      Make sure that you’re supplying the full URL such as rather than and you should be good.

      Let me know, if not.

  3. Hi,
    I’ve juste used your plugin, but have no idea how to use the skype icon… for calling?

    Please help.
    Thanks a lot

      1. No probs. I will edit the code and reorder them based on my requirement. I think some sort of Drag and Drop functionality need to be implemented in the widget. I came across many social profile widgets but none of them have ability to re-order the icons. It would be great if you can include that option in future update. Just my thoughts.

        1. Thanks!

          I used to have this available in a a premium version of the plugin, I cancelled it.

          I’m considering bringing it back, but it’ll be under a slightly different business model, so I’ll definitely consider bringing this feature back into the fold.

  4. I love this widget, it makes life so much easier and my blog so much neater! My buttons used to line up perfectly but lately I have noticed they are not, I tried re-installing a couple but still not lined up. I’m on W/P and her is my link if you would like to take a look. (
    Also, any chance of adding a BlogLovin’ button next update?

    1. Hey Monica,

      It sounds like this may have to do with some CSS that has been introduced in your theme or a plugin. Shoot me an eamil referencing this particular comment and let’s see if we can’t get it taken care of.

  5. Hi!! Congratulations for your work!! It’s nice!!
    I have a question. After installed it, it appears 2 small orange arrows near to the FB icon. Do you know why? Thanks a lot for your help!!!

  6. Hello,
    I’m working with Acid theme. It uses your plugin but I’m not able to install it because when I try to active it, I receive this message:

    Plugin could not be activated because it triggered a fatal error.
    Fatal error: Cannot redeclare class Tipsy_Social_Icons in /mounted-storage/home103a/sub003/sc50191-ATAO/ on line 306

    Is it a my server side problem?
    Please, could you help me to solve it?

    1. Hey GP,

      Based on what you’ve provided, it sounds like the plugin is already installed elsewhere on your blog – its either already bundled with your theme or its added as a second plugin.

      Fatal error: Cannot redeclare class Tipsy_Social_Icons

      This means that the code responsible for the plugin is already located somewhere in your WordPress installation.

  7. Hi Tom,

    What information do I put in the Skype field, in order for people to be taken to connect with me on Skype when they click the icon? I used Skype Developer to generate the code, but the plug in does not accept the code when I copy and paste it into the relevant plug in field.

    What am I doing incorrectly here?


Comments are closed.