How to add Social Bookmark in Blogger?

Tutorial entry for today. for dummies.

Before you learn anything, you’d probably want to know what it is that you’re trying to learn, yes?
So what is Social Bookmark, according to my good buddy wiki, it’s “a method for Internet users to store, organize, search, and manage bookmarks of web pages on the Internet with the help of metadata.

In a social bookmarking system, users save links to webpages that they want to remember and/or share. These bookmarks are usually public, and can be saved privately, shared only with specified people or groups, shared only inside certain networks, or another combination of public and private domains. The allowed people can usually view these bookmarks chronologically, by category or tags, or via a search engine.”

to keep it short and simple, Social bookmark will help boost your traffic.

-Let’s get familiar with the bookmarks that we’ll be implementing today.

-Starting from the left: Zeeb character (Eye Catcher), facebook post-an-item, slashdot, yahoo bookmark, digg, technorati, Reddit, Google bookmark, Stumble Upon, Del.icio.us, and.. (if the the entry indeed has helped you, feel free to put an TIZ icon along with the bookmarks, thanks)

-Unlike the rest of the egocentric buttons, where only the button’s account owner can publish items, TIZ allows anyone to get a chance to explore of the world of imagination.

—————————————————————————————-
Tutorial Starts here: (Meant for blogspot users, only.) (for now)

1. Click Layout 2. Click Edit HTML 3. Check Expand Widget Template.

BAM, now you’re just 3 more steps away from boosting your traffic.

Scroll about 2/3 down the codes. Or..

Click “Ctrl+F” and look for “post.body“

The codes for all the social bookmarks shall be posted right under that high lighted line above.

A preview of the final product:

The book mark buttons should appear at where the high lighted region that’s indicated above.
————————————————————————————
Now that I’ve shown you the teaser, here’s the most technical and difficult part – copy and paste.

You can now go ahead and select the ones you want:
Or all of it (scroll down to the bottom of the page)

Facebook.
<if cond="'data:post.url'"> <a href="http://theimaginaryzebra.blogspot.com/'" u="" target="'_blank'"><img data-lazyloaded="1" src="data:image/gif;base64,R0lGODdhAQABAPAAAMPDwwAAACwAAAAAAQABAAACAkQBADs=" decoding="async" data-src="http://theimaginaryzebra.blogspot.com/"><noscript><img decoding="async" src="http://theimaginaryzebra.blogspot.com/"></noscript></a> </if> 

Slash Dot
<a href="http://theimaginaryzebra.blogspot.com/'" url=" + data:post.url + " title="" target="'_blank'"><img data-lazyloaded="1" src="data:image/gif;base64,R0lGODdhAQABAPAAAMPDwwAAACwAAAAAAQABAAACAkQBADs=" decoding="async" alt="'slashdot'" border="'0'" data-src="http://theimaginaryzebra.blogspot.com/"><noscript><img decoding="async" alt="'slashdot'" border="'0'" src="http://theimaginaryzebra.blogspot.com/"></noscript></a>

Yahoo
<a href="http://theimaginaryzebra.blogspot.com/'" t=" + data:post.url + " title="" target="'_blank'"><img data-lazyloaded="1" src="data:image/gif;base64,R0lGODdhAQABAPAAAMPDwwAAACwAAAAAAQABAAACAkQBADs=" decoding="async" alt="'Yahoo'" border="'0'" data-src="http://theimaginaryzebra.blogspot.com/"><noscript><img decoding="async" alt="'Yahoo'" border="'0'" src="http://theimaginaryzebra.blogspot.com/"></noscript></a>

Digg
<a href="http://theimaginaryzebra.blogspot.com/'" phase="2&url=" title="" target="'_blank'"><img data-lazyloaded="1" src="data:image/gif;base64,R0lGODdhAQABAPAAAMPDwwAAACwAAAAAAQABAAACAkQBADs=" decoding="async" alt="'Digg" border="'0'" data-src="http://theimaginaryzebra.blogspot.com/"><noscript><img decoding="async" alt="'Digg" border="'0'" src="http://theimaginaryzebra.blogspot.com/"></noscript></a>

Technorati
<a href="http://theimaginaryzebra.blogspot.com/'" add=" + data:post.url + " title="" target="'_blank'"><img data-lazyloaded="1" src="data:image/gif;base64,R0lGODdhAQABAPAAAMPDwwAAACwAAAAAAQABAAACAkQBADs=" decoding="async" alt="'Technorati'" border="'0'" data-src="http://theimaginaryzebra.blogspot.com/"><noscript><img decoding="async" alt="'Technorati'" border="'0'" src="http://theimaginaryzebra.blogspot.com/"></noscript></a>

Reddit
<a href="http://theimaginaryzebra.blogspot.com/'" url=" + data:post.url + " title="" target="'_blank'"><img data-lazyloaded="1" src="data:image/gif;base64,R0lGODdhAQABAPAAAMPDwwAAACwAAAAAAQABAAACAkQBADs=" decoding="async" alt="'Reddit'" border="'0'" data-src="http://theimaginaryzebra.blogspot.com/"><noscript><img decoding="async" alt="'Reddit'" border="'0'" src="http://theimaginaryzebra.blogspot.com/"></noscript></a>

Google
<a href="http://theimaginaryzebra.blogspot.com/'" op="edit&output=" bkmk="" title="" target="'_blank'"><img data-lazyloaded="1" src="data:image/gif;base64,R0lGODdhAQABAPAAAMPDwwAAACwAAAAAAQABAAACAkQBADs=" decoding="async" alt="'Google" border="'0'" data-src="http://theimaginaryzebra.blogspot.com/"><noscript><img decoding="async" alt="'Google" border="'0'" src="http://theimaginaryzebra.blogspot.com/"></noscript></a> 

Stumble Upon
<a href="http://theimaginaryzebra.blogspot.com/'" url=" + data:post.url + " title=""><img data-lazyloaded="1" src="data:image/gif;base64,R0lGODdhAQABAPAAAMPDwwAAACwAAAAAAQABAAACAkQBADs=" decoding="async" align="''" alt="'Stumble" data-src="http://theimaginaryzebra.blogspot.com/"><noscript><img decoding="async" align="''" alt="'Stumble" src="http://theimaginaryzebra.blogspot.com/"></noscript></a> 

Del.icio.us
<a href="http://theimaginaryzebra.blogspot.com/'" url="+ data:post.url + " target="'_blank'"><img data-lazyloaded="1" src="data:image/gif;base64,R0lGODdhAQABAPAAAMPDwwAAACwAAAAAAQABAAACAkQBADs=" decoding="async" alt="'Del.icio.us'" border="'0'" data-src="http://theimaginaryzebra.blogspot.com/"><noscript><img decoding="async" alt="'Del.icio.us'" border="'0'" src="http://theimaginaryzebra.blogspot.com/"></noscript></a> 

TIZ icon
<a href="http://theimaginaryzebra.blogspot.com/" target="'_blank'"><img data-lazyloaded="1" src="data:image/gif;base64,R0lGODdhAQABAPAAAMPDwwAAACwAAAAAAQABAAACAkQBADs=" decoding="async" alt="'TIZ'" border="'0'" data-src="http://theimaginaryzebra.blogspot.com/"><noscript><img decoding="async" alt="'TIZ'" border="'0'" src="http://theimaginaryzebra.blogspot.com/"></noscript></a> 

To make things easier, the following is the sum of all the book marks mentioned above.

<if cond="'data:post.url'"> <a href="http://theimaginaryzebra.blogspot.com/'" u="" target="'_blank'"><img data-lazyloaded="1" src="data:image/gif;base64,R0lGODdhAQABAPAAAMPDwwAAACwAAAAAAQABAAACAkQBADs=" decoding="async" data-src="http://theimaginaryzebra.blogspot.com/"><noscript><img decoding="async" src="http://theimaginaryzebra.blogspot.com/"></noscript></a> </if> <a href="http://theimaginaryzebra.blogspot.com/'" url=" + data:post.url + " title="" target="'_blank'"><img data-lazyloaded="1" src="data:image/gif;base64,R0lGODdhAQABAPAAAMPDwwAAACwAAAAAAQABAAACAkQBADs=" decoding="async" alt="'slashdot'" border="'0'" data-src="http://theimaginaryzebra.blogspot.com/"><noscript><img decoding="async" alt="'slashdot'" border="'0'" src="http://theimaginaryzebra.blogspot.com/"></noscript></a> <a href="http://theimaginaryzebra.blogspot.com/'" t=" + data:post.url + " title="" target="'_blank'"><img data-lazyloaded="1" src="data:image/gif;base64,R0lGODdhAQABAPAAAMPDwwAAACwAAAAAAQABAAACAkQBADs=" decoding="async" alt="'Yahoo'" border="'0'" data-src="http://theimaginaryzebra.blogspot.com/"><noscript><img decoding="async" alt="'Yahoo'" border="'0'" src="http://theimaginaryzebra.blogspot.com/"></noscript></a> <a href="http://theimaginaryzebra.blogspot.com/'" phase="2&url=" title="" target="'_blank'"><img data-lazyloaded="1" src="data:image/gif;base64,R0lGODdhAQABAPAAAMPDwwAAACwAAAAAAQABAAACAkQBADs=" decoding="async" alt="'Digg" border="'0'" data-src="http://theimaginaryzebra.blogspot.com/"><noscript><img decoding="async" alt="'Digg" border="'0'" src="http://theimaginaryzebra.blogspot.com/"></noscript></a> <a href="http://theimaginaryzebra.blogspot.com/'" add=" + data:post.url + " title="" target="'_blank'"><img data-lazyloaded="1" src="data:image/gif;base64,R0lGODdhAQABAPAAAMPDwwAAACwAAAAAAQABAAACAkQBADs=" decoding="async" alt="'Technorati'" border="'0'" data-src="http://theimaginaryzebra.blogspot.com/"><noscript><img decoding="async" alt="'Technorati'" border="'0'" src="http://theimaginaryzebra.blogspot.com/"></noscript></a> <a href="http://theimaginaryzebra.blogspot.com/'" url=" + data:post.url + " title="" target="'_blank'"><img data-lazyloaded="1" src="data:image/gif;base64,R0lGODdhAQABAPAAAMPDwwAAACwAAAAAAQABAAACAkQBADs=" decoding="async" alt="'Reddit'" border="'0'" data-src="http://theimaginaryzebra.blogspot.com/"><noscript><img decoding="async" alt="'Reddit'" border="'0'" src="http://theimaginaryzebra.blogspot.com/"></noscript></a> <a href="http://theimaginaryzebra.blogspot.com/'" op="edit&output=" bkmk="" title="" target="'_blank'"><img data-lazyloaded="1" src="data:image/gif;base64,R0lGODdhAQABAPAAAMPDwwAAACwAAAAAAQABAAACAkQBADs=" decoding="async" alt="'Google" border="'0'" data-src="http://theimaginaryzebra.blogspot.com/"><noscript><img decoding="async" alt="'Google" border="'0'" src="http://theimaginaryzebra.blogspot.com/"></noscript></a> <a href="http://theimaginaryzebra.blogspot.com/'" url=" + data:post.url + " title=""><img data-lazyloaded="1" src="data:image/gif;base64,R0lGODdhAQABAPAAAMPDwwAAACwAAAAAAQABAAACAkQBADs=" decoding="async" align="''" alt="'Stumble" data-src="http://theimaginaryzebra.blogspot.com/"><noscript><img decoding="async" align="''" alt="'Stumble" src="http://theimaginaryzebra.blogspot.com/"></noscript></a> <a href="http://theimaginaryzebra.blogspot.com/'" url="+ data:post.url + " target="'_blank'"><img data-lazyloaded="1" src="data:image/gif;base64,R0lGODdhAQABAPAAAMPDwwAAACwAAAAAAQABAAACAkQBADs=" decoding="async" alt="'Del.icio.us'" border="'0'" data-src="http://theimaginaryzebra.blogspot.com/"><noscript><img decoding="async" alt="'Del.icio.us'" border="'0'" src="http://theimaginaryzebra.blogspot.com/"></noscript></a> <a href="http://theimaginaryzebra.blogspot.com/" target="'_blank'"><img data-lazyloaded="1" src="data:image/gif;base64,R0lGODdhAQABAPAAAMPDwwAAACwAAAAAAQABAAACAkQBADs=" decoding="async" alt="'TIZ'" border="'0'" data-src="http://theimaginaryzebra.blogspot.com/"><noscript><img decoding="async" alt="'TIZ'" border="'0'" src="http://theimaginaryzebra.blogspot.com/"></noscript></a> 
Just copy and paste.

Hope the entry has helped you bloggers out a bit.

-Benson
http://www.theimaginaryzebra.com

http://www.theimaginaryzebra.com