Follow this blog

Tuesday, March 2, 2010

Add digg button to every post

This article will step-by-step guide reader to place a real time Digg count button to every single blogger post. With Digg button you have a better chance your post will be digged and get you more web traffic. In this article reader can also find how to add Digg button on top or bottom of each post and how to align Digg button on left or right side of posts.

Example of Digg button:

Digg button


How to add Digg button to every blogspot post


To add Digg button to every post on your blogger blog you should copy and paste this code in blogger template:

<script type='text/javascript'>
digg_url = &#39;<data:post.url/>&#39;;
</script>
<script src='http://digg.com/tools/diggthis.js' type='text/javascript'/>


You can add Digg button on the beginning of every post or on the bottom of every post. In HTML layout search for <data:post.body/> and paste the code just before if you want to have Digg button on the top of the post or after it for twitter button on the bottom of the post.


Here are step by step guide to add Digg button counter to blogger:

  • Go to Layout in your blogspot blog

  • Click on Layout --> Edit HTML

  • it is recommended to backup template on local hard disk before doing any change in edit template box

  • check on Expand Widget Template checkbox

  • find <data:post.body/>

  • for Digg button counter on the top of post add Digg button code (for code check code above) before <data:post.body/>

    ...

    [DIGG BUTTON CODE]
    <data:post.body/>
    ...

  • or you can want Digg button on the end of your posts, add Digg button code just after the <data:post.body/>

    ...
    <data:post.body/>
    [DIGG BUTTON CODE]
    ...



How to align Digg button left or right

To align your Digg button left use this code:

<div style='padding: 4px; float: left;'>
[DIGG BUTTON CODE]
</div>


Code needed to align your Digg button counter right:
<div style='padding: 4px; float: right;'>
[DIGG BUTTON CODE]
</div>


Sample code for Digg button on beginning of every post on right side:

<div style='padding: 4px; float: right;'>
<script type='text/javascript'>
digg_url = &#39;<data:post.url/>&#39;;
</script>
<script src='http://digg.com/tools/diggthis.js' type='text/javascript'/>
</div>


<data:post.body/>


2 comments:

Web Marketing Company said...

Digg Button is really interesting for the showing the visibility of the websites over the search engines.

john hillage said...

Excellent! I admire all the helpful data you've shared in your articles. I'm looking forward for more helpful articles from you. :)