• How To Add A New Digg Button To Every Post On Blogger


    Digg has been rolled out their new site design and it 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 were available in four different sizes and formats.



    There are four types of buttons, that you can add to your blog.
    1. Medium Digg Button
    2. Large Digg Button
    3. Compact Digg Button
    4. Icon Digg Button
    Medium Smart 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 'DIGG' code
    4. <!--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-->
    5. Paste it on top of <data:post.body/> this code.
    6. Preview your template and if everything works fine, then save it.
    Large Smart Digg Button

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

    <!--DIGG LARGE BUTTON BEGINS-->
    <script src="http://widgets.digg.com/buttons.js" type="text/javascript"></script>
    <a class="DiggThisButton DiggLarge" expr:href="data:post.url"></a>
    <!--DIGG LARGE 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/> instead of the above 'DIGG' button code.

    <!--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/> instead of the above 'DIGG' button code.

    <!--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.

    Try It easy.
    Live Demo

    0 comments:

    Post a Comment