A Social Networking Toolbar for Your Blog

There are already many articles about how to put social bookmarking links on a blog. Why write another one? That's a justified question and I wouldn't have written this post without having an answer to it. Many ways to embed social bookmarks take long, slow down page loading, or lack some features. I will explain a way that is easy to install in any website or blog, is very fast in loading, and offers features for more than 230 social networks, and in about 50 languages. If this sounds useful keep on reading.

In a social bookmarking system or social network, users store lists of internet resources, which they find useful. Often, these lists are publicly accessible, and other people with similar interests can view the links by category, or tags. In order to get backlinks and incoming traffic, and pagerank, it is an imperative to make tagging and bookmarking easy. I wrote about this in my article on social networking features for blogs.

There are many posts on how to put social bookmarking features on a blog, however most posts I saw on social bookmarking features propose a method that uses several images. Sometimes you are required to upload these images, other posts propose that each time your blog is loaded, these images have to be loaded from different hosting services. If you want a fast loading blog, you'd better not do this.

In this post I show a way I haven't seen implemented in any blog yet (however on a few other websites). It uses CSS Sprites for fast loading, provides many features for customization, and is very easy to install.

Addthis is a social bookmarking service and it's one of addthis lesser-known feature I am going to present in this post. I accidentally found out its toolbox options when looking in the addthis javascript file.

You can specify the social networks you want to use and customize the look. In the following, starting from an example, I show how to put a social bookmarking toolbar on any website or blog. In the end I come to which social networks are most used.

Default Look

A typical social networking toolbar would look like this:

|More

This is the HTML code which you would have to insert into your template to get exactly the toolbar above:

<div class="addthis_toolbox addthis_default_style">
<a class="addthis_button_email" title="Email"></a>
<a class="addthis_button_print" title="Print"></a>
<a class="addthis_button_twitter" title="Tweet This"></a>
<a class="addthis_button_facebook" title="Share to Facebook"></a>
<a class="addthis_button_myspace" title="Share to MySpace"></a>
<a class="addthis_button_stumbleupon" title="StumbleUpon"></a>
<a class="addthis_button_digg" title="Digg This"></a>
<span class="addthis_separator">|</span>
<a class="addthis_button_expanded" title="More Choices">More</a><script src='http://s7.addthis.com/js/250/addthis_widget.js' type='text/javascript'></script>
</div>

To install this toolbar in a blogger template you would paste this code typically below this line:
<p class='post-footer-line post-footer-line-3'/>

Customization

You can put any social network there and completely customize the toolbar. This is the way to set the destination (social network) and the icon:
<a class="addthis_button_destination code"></a>

You can find about 230 more destination codes on the addthis services list.

Addthis offers an analytics feature which you can use if you register with addthis. Note that it is optional to register. The analytics feature shows most used services on your blog, bookmarked content, and where people came from who bookmarked. If you want to see this you should add your addthis username to the script call like this:
<script src='http://s7.addthis.com/js/250/addthis_widget.js?pub=username' type='text/javascript'/>


By default, the language of the visitor's browser is recognized and your toolbox is adapted correspondingly. If you want to use always a particular language, you can also do it.

Most Popular Social Networks

Ok, now which social networks should you choose? As of now, according to addthis data from the last 180 days, internationally these social bookmarking sites were most used:


On the same page you can also see the most popular social network sites for specific countries and also upcoming social bookmarking sites. As of December 2009 sites with most gains of usage are Sonico, meinVZ, Nujij, OKNOtizie, and orkut.

Now that you have a great toolbar, you are one step closer to success.

Success in social networks depends on many factors. You might want to read my summary of scientific studies about digg, called How Digg Works to get a better idea about these factors.

I hope this post was useful to you. Which social networks would you want to put in such a toolbar?