Add digg button to WordPress
The Digg This button is for website and blog publishers that want to encourage their audience to submit or digg their content on Digg. This is sort tutorial about adding digg button on your WordPress themes.
There is three different ways to implement digg button on website or wordpress.
- ‘Digg This with Submit Capability
- Simple “Digg This” with Digg Count (original version)
- Custom Submission-Only Button
Example Digg integration code:
<script type="text/javascript"> digg_url = 'WEBSITE_URL'; </script> <script src="http://digg.com/tools/diggthis.js" type="text/javascript"></script>
On wordpress themes , we can placing the digg button code on:
1. index.php (if you whant showing digg button on each post on your home page)
2. single.php (showing digg button when user click on your individual post)
In wordpress, the think we have todo is replace WEBSITE_URL with wordpress template tags <?php the_permalink() ?> somewhere within the loop.
For example, placing the digg button on single.php
Default single.php
<div id="content">
<?php if(have_posts()) : ?><?php while(have_posts()) : the_post(); ?>
<div class="post">
<h2><a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>"><?php the_title(); ?></a></h2>
<span class="postDate"><?php the_date('F j, Y'); ?> in <?php the_category(', ') ?> by <?php the_author() ?></span>
<div class="entry">
<?php the_content('&amp;amp;raquo; &amp;amp;raquo; &amp;amp;raquo;'); ?>
</div>
<?php comments_template(); ?>
</div>
<?php endwhile; ?>
<?php endif; ?>
</div>
Placing digg button within wordpress loop, before comment_template() tag;
<div id="content">
<?php if(have_posts()) : ?><?php while(have_posts()) : the_post(); ?>
<div class="post">
<h2><a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>"><?php the_title(); ?></a></h2>
<span class="postDate"><?php the_date('F j, Y'); ?> in <?php the_category(', ') ?> by <?php the_author() ?></span>
<div class="entry">
<?php the_content('&amp;amp;raquo; &amp;amp;raquo; &amp;amp;raquo;'); ?>
</div>
<div id="social_bookmarks">
<div class="social_button">
<div class="digg">
<script type="text/javascript">
digg_url = '<?php the_permalink() ?>';
</script>
<script src="http://digg.com/tools/diggthis.js" type="text/javascript"></script>
</div>
<?php comments_template(); ?>
</div>
<?php endwhile; ?>
<?php endif; ?>
</div>
By now you have already digg button on your wordpress. You can also styling the css presentation to make your digg button look more pretty.
This is the css that im using on my wordpress themes.
#social_bookmarks .social_button {
background:#f7f7f7 none repeat scroll 0 0;
border:1px solid #eee;
margin:0;
padding:10px;
height:100px;
}
#social_bookmarks .digg{
background-color:#FFFFFF;
border:1px solid #D6D3CA;
float:left;
margin-left:4px;
padding:2px;
width:51px;
}
0
511
