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
- Evernote
- Flickr
- Forrst
- FourSquare
- GitHub
- Google+
- LastFM
- Picasa
- Rdio
- RSS
- Skype
- Soundcloud
- Stack Overflow
- Tumblr
- 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 WebHostingGeeks.com for the Slovak translation!
Simple and Good plugin
Thanks Jayant!
How do I change the settings?
All of the settings are contained within the widget’s admin panel when you drag it into a sidebar.
I love this widget and would love it if you added yfrog and reddit
I think I may need a bit of help :) Was able to install and get most links working well except for LinkedIn – this is the link I used: linkedin.com/pub/monica-parlee/32/700/390 and subscribe by e-mail – this is the link I used: http://feedburner.google.com/fb/a/mailverify?uri=blogspot%2FWYjyZR I checked and redid them a couple times. any suggestions? This is my blog site – http://oldermommystillyummy.com
Thanks so much,
Monica
Hey Monica,
For LinkedIn, the URL should be
http://www.linkedin.com/pub/monica-parlee/32/700/390/
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!
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 monica.parlee@gmail.com…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!
Monica
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:
mailto:monica.parlee@gmail.com
And see if that doesn’t have the effect you’d like.
Let me know!
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.
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!
I uploaded Tipsy to use on my website, but was disappointed to not find IMDb among the other icons. Any chance of adding it???
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!
Nice plugin, thanks a lot.
¿Could you please add Behance? http://www.behance.net/ Thank you.
Happy Holidays.
Making a note – will see what I can do for the next version.
any way you can add instagram to your plugin you have the best social plugin out there thanks
Thanks – I’ve added this as a feature request and will see about getting it in soon!
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.
Hey Jeremy – this likely has to do with your theme or a conflicting plugin. Regardless, I’d be glad to take a look. Shoot me an email at this page and we’ll go from there.
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.
greetings
Julie
Whatever URL you use for your RSS feed is what will go in this box.
If you use WordPress’ feed, then it’s usually http://YourDomain.com/feed. If it’s FeedBurner, it’s usually http://feeds.feedburner.com/YourFeed/.
Hope this helps!
Love the plugin, thank you!!!
Any chance you could provide the ability to re-order the icon output?
Hello Tom –
I installed the plug-in and it looks great, but I get this error page when I click on the icon.
http://365movement.com/www.twitter.com/go365movement
Appreciate the help,
Sure thing, Matt.
Make sure that you’re supplying the full URL such as
http://twitter.com/go365movement/
rather thantwitter.com/go365movement/
and you should be good.Let me know, if not.
Hi,
I’ve juste used your plugin, but have no idea how to use the skype icon… for calling?
Please help.
Thanks a lot
You should be able to provide the following info in the URL field:
skype:username?call
Is it possible to change the order of the icons without touching the code? Anyhow very nice plugin, like it!
Thanks!
Unfortunately, no. The icons are ordered as you see in the dashboard.
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.
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.
Glad to know this. Will be waiting for that. Thank you.
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. (http://oldermommystillyummy.com)
Also, any chance of adding a BlogLovin’ button next update?
Thanks,
Monica
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.
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!!!
This has to do with a style in your theme. If you’re interested, I can help by providing the necessary CSS to clean this up. Shoot me an email.
Excellent plugin. If you added “Yammer” I’d actually use it. Hope you do.
Hey Bob – I’ll definitely take this into consideration and see about doing a release for it sometime soon!
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/viscere.it/wp-content/plugins/tipsy-social-icons/plugin.php on line 306
Is it a my server side problem?
Please, could you help me to solve it?
Thanks
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.
This means that the code responsible for the plugin is already located somewhere in your WordPress installation.
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?
Helen
Hey Helen,
You should be able to add this: `skype:skypename` where “skypename” is your Skype username.
This is what I have been looking for. Thanks
Sure thing!
Hi Tom, what shortcode do I use to express the content in a non-widget area?
Hey Sharon,
Unfortunately, the plugin doesn’t support shortcodes so it can only work in a widgetized area.
Thanks a lot for the question!
Tom, thank you for your speedy response in clarifying this.
Can you add instagram icon?
Hey Enrico – unfortunately, I just retired this project today.