How to Add Social Bookmark Widget/Links to Blogger

Share

Social Bookmark Links are widely used by bloggers to help their readers share the useful contents to the world! Digg, Technorati, Delicious, Stumble Upon, Facebook etc are widely used online social bookmarking and sharing communities.

This post explains how to add Social Bookmark Links below post body(content) in Blogger(blogspot) blogs. It’s very simple, just do the following steps:

1. Go to Blogger Dashboard – click Edit Layout – then click Edit HTML

2. Select Expand Widget Templates as shown in the image below:
   
3. Then Search(Ctrl+F) the code given below in your template:
   <div class="post-footer-line post-footer-line-1">
4. Add the code given below just after the above line:
   <!– Start of social bookmarks –>
   <b><i>Share this:</i>
   |<a expr:href=’&quot;http://digg.com/submit?phase=2&amp;url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title’ target=’_blank’>Digg</a> |
   <a expr:href=’&quot;http://twitthis.com/twit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title’ target=’_blank’>Twitter</a> |
   <a expr:href=’&quot;http://technorati.com/faves?add=&quot; + data:post.url’ target=’_blank’>Technorati</a> |
   <a expr:href=’&quot;http://del.icio.us/post?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title’ target=’_blank’>Del.icio.us</a> |
   <a expr:href=’&quot;http://www.stumbleupon.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title’ target=’_blank’>StumbleUpon</a> |
   <a expr:href=’&quot;http://www.facebook.com/share.php?u=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title’ target=’_blank’>Facebook</a> |
   </b>
   <!– End of social bookmarks –>
5. Finally, Save the Template. Finished!

You will see Social Bookmark Links as shown in the image below. Drop Comments!

UPDATE: Now you can add SHARE BUTTONS from the Blogger Design page easily. Read more HERE.

Share

Article by Shafar.
About the Author: Tech Freak, Android Lover, Wordpress Addict, Social Media Junkie and the Founder of TipsBlogger.
To submit guest posts to TipsBlogger, please read the Guidelines.

37 Responsesto “How to Add Social Bookmark Widget/Links to Blogger”

1. jj-momscashblog says:

   December 31, 2008 at 2:55 am

   Hi Shafar,Great post,but my only problem is because I bought my blog everytime I try to sign up with one of the Social Networks and I don’t have the passwords I’m not allowed to sign up. Each one that I’ve tried to sign up with will tell me that MCB is already signed up, so I can’t sign up again. I can’t get in touch with the prior owner so I’m kind of in a mess. If you have any solutions please let me know.It would be great for my blog if I could sign up with a couple of them. Have you signed up with Squidoo? I’m interested in that one. But not sure how it works. Have a great day.
2. Shafar says:

   December 31, 2008 at 8:49 am

   @jj-momscashblog
   Hi JJ, the best thing you can do now is contacting the prior owner of MCB. But if you are not able to contact her, then try contacting the Administrator of the concerned Social Networks and request them for better solution. They might take actions to delete the old account if it’s inactive.Wanna know about Squidoo? I know NOTHING! I didn’t tried that yet! Mostly I use Blog-Catalog, Bloglog, Digg, Stumble Upon, Facebook, Technorati etc.Keep in Touch…
3. Shafar says:

   January 1, 2009 at 6:54 am

   @Earn2achieve
   Thanks for bookmarking this page!Keep in Touch. . .
4. Earn2achieve says:

   January 1, 2009 at 5:28 am

   Nice article to make used by all bloggers. Better I bookmark this page at my favourite bookmarking website http://southspice.co.cc
5. Near says:

   February 8, 2009 at 12:23 pm

   Thanks a lot, ive been looking for this, here’s my blog http://nearshare.blogspot.com/
6. Prof. Yodz says:

   March 3, 2009 at 10:59 am

   very helpful tip.. tried it in all my blogs. cool
7. Penny Williams says:

   March 17, 2009 at 4:34 pm

   I cannot find the code in my template where I am supposed to insert this share code. Can anyone look at my site and tell me where to insert? http://adhdmomma.blogspot.com Thanks!
8. Shafar says:

   March 18, 2009 at 10:36 am

   @Penny Williams
   I think you added another type of social bookmarking widget after this comment! It looks great!Let me know if you want to add this kind of social bookmark links itself
9. Shafar says:

   March 24, 2009 at 3:18 pm

   @Perspective Shift Chris
   Glad that this is the best post you’ve found today on this topic! Keep in touch..
10. Perspective Shift Chris says:

    March 24, 2009 at 1:46 pm

    Heya, thanks so much for this. I originally had an issue blending it well into my blog bt then figured I just needed to center it due to my blog design. That and change the colors from my main link color. Thanks so much for this! It’s very much so appreciated. This is the best post I’ve found today while searching for how to do this.
11. unheard maladies says:

    April 6, 2009 at 12:02 pm

    Awesome… just what I was looking for. Thanks!
12. Doodle says:

    April 14, 2009 at 3:19 pm

    Doodlekit is a fully hosted online free website builder and CMS (Content Management System) that helps you build a personal or business website. It’s perfect for anyone from first-timers to advanced web developers and web designers. Unlike other website creator tools, Doodlekit is all online. You don’t need to install any software on your computer, and you can use it from any computer, anywhere in the world that has internet access, at any time. To know more visit http://doodlekit.com/home
13. Clare Cassar says:

    April 29, 2009 at 7:04 am

    Awesome – I just took a very basic course in HTML this weekend and it’s enough to have given me the confidence to try this and some other stuff that has been bugging me about my template for a while. Thanks so much for this code!!!www.parkerandcompany.blogspot.com
14. Phang says:

    May 7, 2009 at 11:12 am

    I cannot find the code in my template where I am supposed to insert this share code.
15. Shafar says:

    May 9, 2009 at 3:44 pm

    @Phang
    Did you Expanded the Widget Templates? If you need my help, just drop your blog URL here.
16. Hasmat says:

    June 17, 2009 at 8:45 pm

    sorry i did not able to install it in my bloghttp://loansinusa.blogspot.com/
17. Shafar says:

    June 18, 2009 at 2:52 pm

    @Hasmat
    Hi, you got any error message while saving your template?
18. Komi says:

    July 4, 2009 at 8:50 pm

    Thanks a lot. That is exactly what i wanted.
19. People Search says:

    July 22, 2009 at 2:49 am

    We were unable to save your templatePlease correct the error below, and submit your template again.Your template could not be parsed as it is not well-formed. Please make sure all XML elements are closed properly.XML error message: The reference to entity "title" must end with the ';' delimiter.
20. People Search says:

    July 22, 2009 at 2:49 am

    I keep getting this message after I try & save the code.
21. Shafar says:

    July 24, 2009 at 2:04 pm

    @People Search
    Oops! I have altered the code, it works perfect now! Try it again!
22. sHady says:

    July 27, 2009 at 6:59 am

    great post thanks a lot
23. smgl says:

    August 26, 2009 at 8:04 am

    thanks for it
24. Adsense & Blogger Tips says:

    September 9, 2009 at 5:16 am

    it works. thanks for the tutorial. (",)
25. Roschelle says:

    September 13, 2009 at 12:16 pm

    THANK YOU SO MUCH!!!!!! I downloaded a new template last night. The post section is relatively narrow and I've been searching for hours for a social bookmark code that would fit. You are a life saver. Thanks again!!!
26. musicmate says:

    October 11, 2009 at 12:39 pm

    thank you so mush for helpinghttp://ihearmusichere.blogspot.com
27. Entertainment says:

    April 24, 2010 at 7:02 pm

    Great post
28. Russel says:

    April 27, 2010 at 9:16 am

    I think above code is not working correctly so please mail me the exact keyword so that I can add social bookmark links
29. Shafar@TipsBlogger says:

    April 27, 2010 at 3:43 pm

    @Russel
    It's working fine. Let me know what error did you get.
30. Farhanshahid2009 says:

    July 14, 2010 at 2:06 pm

    Can you tell how you put the one you use? the 'sharing is caring thing'
31. Shafar@TipsBlogger says:

    July 14, 2010 at 7:30 pm

    @ Farhanshahid2009
    Use this plugin:
    http://wordpress.org/extend/plugins/sexybookmarks/
32. top tips says:

    April 19, 2011 at 11:41 am

    Thank you for sharing this tricky tip, but i think i’ll replace it with addthis code
33. Windows7me says:

    June 14, 2011 at 12:56 am

    thank you for that tutorial brother, i think i im going to us it right now,
34. FreeBloggerTutorial says:

    August 19, 2011 at 7:10 am

    It’s really a nice and useful piece of info. I’m glad that you just shared this helpful information with us. Please stay us up to date like this. Thank you for sharing & could you please tell me how to add google+1 button in wordpress.com blog. Thankx in advance, I would really appreciate your answer. Waiting for your reply.
35. Shafar says:

    August 28, 2011 at 11:47 am

    @FreeBloggerTutorial
    You can get the button code from here:
    http://www.google.com/intl/en/webmasters/+1/button/index.html
36. cyracks says:

    November 25, 2011 at 3:49 pm

    thanks for this post, it will serve well for newbies. i also implement it on my blog http”//bloggersfaq.blogspot.com
37. bill says:

    January 16, 2012 at 12:08 am

    Excellent tutorial!Thanks a lot!