Add Digg button to Blogger

This is the step by step guide to show you how to add a Digg button to your Blog....
Digg is a social content website where your readers or you can submit content to. If you have a good story, members will 'digg' the post and write comments. As a blog owner, you may want to make it easy for and encourage your readers to submit and digg your articles.

Automatic Count and Vote Button

Before you do that though, you would want to take note of the following:-

1. Your blog should be set to save Post Pages. Post Pages are archived blog posts published to their own web page. Each post will have a unique URL, which is required by Digg for the individual posts to be submitted. To verify or enable it, login to your Blogger Dashboard. Under Settings-> Archiving, set the “Enable Post Pages?” to “Yes” and save the settings.

2. This template hack will put a Digg button to every post. You are therefore not able to choose which post you want to include or exclude a button. If you would prefer to have a Digg button added only to some posts, read the later part of this article on “Button for selective posts.”

3. The code reads the URL of the individual blog page and this shall be the URL used for submission of the story to Digg.

Under “Template”, click the “Edit HTML” tab. Block copy the entire HTML code for your site and save it in a text file. You can also click the "Download Template" link. This is one of the two necessary steps whenever you want to change the template. The second step is of course to “Preview” the new changes, and save the changes only when you are satisfied. The backup you have saved in a text file will come in handy when you accidentally click to save the changes without previewing them. With a backup, you can easily restore the template to the prior state if need be.

Click the box next to “Expand Widget Templates”. Scroll about two-thirds down the template to look for the code that reads:-

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


If you want the button to show at the top right corner of your post, replace the above code with 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>


This is what you get:-


Please leave a comment if you like this post or subscribe to this blog via RSS or Email.

5 comments:

  1. But what if you don't have that line in your blogger Template? Mine looks like this. think you can help?

    /* Posts
    ----------------------------------------------- */
    h2.date-header {
    font-size:11px;
    color:#E8BA58;
    margin-left:6px;
    padding-top:10px;
    line-height:1em;
    font-family:Arial;
    }

    .post {
    padding:10px 5px 20px;
    }

    .post h3 {
    margin:0;
    padding:0;
    font-size:140%;
    font-weight:normal;
    line-height:1em;
    margin:0 0 10px;
    color:#cc6600;
    }

    .post h3 a,.post h3 a:visited,.post h3 strong {
    display:block;
    text-decoration:none;
    color:#cc6600;
    font-weight:normal;
    }

    .post h3 strong,.post h3 a:hover {
    text-decoration:underline;
    }

    .post-body {
    padding:10px 0 0;
    line-height:1.6em;
    }

    .post-body blockquote {
    line-height:1.3em;
    }

    .post-footer {
    line-height:1.8em;
    font-style:italic;
    padding:30px 0 5px;
    }

    .comment-link {
    margin-left:.6em;
    }

    .post img {
    }

    .post blockquote {
    font-size:12px;
    font-style:italic;
    margin:0;
    min-height:30px;
    padding:0 0 0 50px;
    width:85%;
    }

    .post blockquote p {
    margin:.75em 0;
    }

    .post-labels {
    padding-top:5px;
    }

    .post-author {
    padding-top:5px;
    }

    .comment-link {
    padding-top:5px;
    }

    .jump-link a {
    color:#7C4B20;
    }

    ReplyDelete
  2. Now I know how to install Automatic Count and Vote Button on my blog thanks fore the idea.

    ReplyDelete
  3. Wonderful learn, I just handed this onto a colleague who was doing a little analysis on that. And he really bought me lunch as a result of I discovered it for him smile So let me rephrase that: Thanks for lunch! Anyway, in my language, there aren’t much good supply like this.

    ReplyDelete
  4. The blog is innovative and provide essential information to viewers regarding this issue.I hope you will provide such more excellent information to us in coming days.

    ReplyDelete
  5. It can be enlightening to come along with a site that offers much specifics of any common subject just like that which you are covering. Appreciate posting, keep up the nice work!

    ReplyDelete

Share your ideas with us, we will be very greatful to hear from you