Add the new Digg button to every post on Blogger blog

Tweet

Previous post: Add a Digg button to every post on Blogger blog

Digg has been rolled out their new site design and they have made major changes in their widgets and official buttons for blogs and websites.

The new Digg buttons works as same as the old ones. A reader can click the Digg button to submit an article on Digg, where other users can vote on the story and spread it. However, the new digg buttons are available in four different sizes and formats.

Demo

Wide button	Medium button	Compact button	Icon button

Wide Digg Button

First you need to backup your blogger template. In your blogger dashboard, click on 'Layout' > 'Edit HTML' and then click on 'download full template' and save your template.

1. Go to Blogger Dashboard > Layout > Edit HTML and check the "Expand Widget Templates" option.
2. Press CTRL+F to find the code which looks like <data:post.body/>
3. Copy the below code

<!--DIGG WIDE BUTTON BEGINS-->
<script src="http://widgets.digg.com/buttons.js" type="text/javascript"></script>
<a class="DiggThisButton DiggWide" expr:href="data:post.url"></a>
<!--DIGG WIDE BUTTON ENDS-->

4. Paste it on top of <data:post.body/> this code.
5. Preview your template and if everything works fine, then save it.

Medium Digg Button

If you want to add Medium Digg button, then paste the below code on top of <data:post.body/>

<!--DIGG MEDIUM BUTTON BEGINS-->
<script src="http://widgets.digg.com/buttons.js" type="text/javascript"></script>
<a class="DiggThisButton DiggMedium" expr:href="data:post.url"></a>
<!--DIGG MEDIUM BUTTON ENDS-->

Compact Smart Digg Button

If you want to add Compact Digg button, then paste the below code on top of <data:post.body/>

<!--DIGG COMPACT BUTTON BEGINS-->
<script src="http://widgets.digg.com/buttons.js" type="text/javascript"></script>
<a class="DiggThisButton DiggCompact" expr:href="data:post.url"></a>
<!--DIGG COMPACT BUTTON ENDS-->

Icon Smart Digg Button

If you want to add Icon Digg button, then paste the below code on top of <data:post.body/>

<!--DIGG ICON BUTTON BEGINS-->
<script src="http://widgets.digg.com/buttons.js" type="text/javascript"></script>
<a class="DiggThisButton DiggIcon" expr:href="data:post.url"></a>
<!--DIGG ICON BUTTON ENDS-->

Now you can see a Digg button to the next of your post paragraph. Your visitors will be able to Digg your blog posts by simply clicking on the Digg button.