Adding Digg button to your posts

Digg it! Ok, but how? There isn't any button anywhere in the post. So the question is "HOW DO I ADD A DIGG BUTTON TO MY POSTS?"

First I'm going to tell you that we are dealing with html again. Follow this tutorial carefully, or you will risk ruining your blog! All right, lets get started.

As you might have expected, our number 1 step is to go to Dashboard > Layout and click on the Edit html tab. Then check the box that says 'Expand Widget Templates'. Note that this step is very important, if you don't tick the box you would not be able to see the html code properly. Now look for the tag:

<p><data:post.body></p>

At this point you have several option, either to put the button on the right, left, or after a post. Decide first, then continue reading.

If you want to put it on the right side of each post, add the following code before <p><data:post.body></p>,so it will look like this:

<div style='float:right; margin-left:10px;'>
<script type='text/javascript'>
digg_url="<data:post.url/>";
</script>
<script src='http://digg.com/tools/diggthis.js' type='text/javascript'/></div><p><data:post.body></p>

If you want to show the button at the end of each posts, add the code after <p><data:post.body></p>, so it will look like this:

<p><data:post.body></p>
<div style='float:right; margin-left:10px;'>
<script type='text/javascript'>
digg_url="<data:post.url/>";
</script>
<script src='http://digg.com/tools/diggthis.js' type='text/javascript'/></div>

Or if you want the button to appear on the left side of each post, add this line instead:

<div style='float:left; margin-right:10px;'>
<script type='text/javascript'>
digg_url="<data:post.url/>";
</script>
<script src='http://digg.com/tools/diggthis.js' type='text/javascript'/></div><p><data:post.body></p>

Note that the code is similar to all the above, but with a slight modification, that is, you reverse the float parameter from right to left and the margin from left to right.

Wait, this ain't over yet, Digg still have one more button in its sleeves: a small, compact button. This is button is handy if you want to save some space (like I do, check out the Digg button in this blog), as the regular button could easily be larger than the post itself. To add a compact button to each post, paste this code instead:

<div style='float:right; margin-left:10px;'>
<script type='text/javascript'>
digg_url="<data:post.url/>";
digg_skin="compact";
</script>
<script src='http://digg.com/tools/diggthis.js' type='text/javascript'/></div><p><data:post.body></p>

You may have notice that we have just added a single line to the code, and that's what makes the difference. That's all I've got to tell, and if you got any technical problem, just comment to this post. Happy Digg-ing!