Tutorial: Beautiful big Social Bookmarking buttons

I got a question from Gabstero

Hi!

Quick question:

What plugin are you using for those beautiful big Social Bookmarking buttons at the bottom of your Indomagz worpress page? (Stumble, Delicious, Technorati, etc)

I like the fact that they are big as opposed to the other tiny ones you find on the web.

Thanks!
Gabi.

I don’t use any Wordpress plugins for this. If i can do it without a plugin, then i’ll not use any plugin.

Beautiful Big Social Bookmarking Buttons

This is a short tutorial for you, with detail instruction, for both Wordpress and Blogger

Wordpress

First, you have to download the images and upload them to the /images folder in your current theme.

  Beautiful Big Social Bookmarking Buttons (28.3 KiB, 1,091 hits)
You need to be a registered user to download this file.

Edit your theme files, single.php and/or page.php and/or index.php . Copy and paste the code below after <?php the_content('Read more &raquo;'); ?>

<div style="clear:both; ">
<div style="width:60px; float:left;">
<script type="text/javascript">
digg_url = '<?php the_permalink() ?>';
</script>
<script src="http://digg.com/tools/diggthis.js" type="text/javascript"></script>
</div>
<div style="width:60px; float:left;">
<script type="text/javascript" src="http://d.yimg.com/ds/badge2.js" badgetype="square"><?php the_permalink() ?></script>
</div>
<div style="width:65px; float:left;">
<a href="http://www.stumbleupon.com/submit?url=<?php the_permalink() ?>&amp;title=<?php the_title(); ?>" target="_blank" rel="external nofollow"><img src="<?php echo bloginfo(stylesheet_directory) .'/images/'; ?>stumble.gif" style="padding:0;margin:0;border:none;" alt="Stumble" /></a>
</div>
<div style="width:65px; float:left;">
<a href="http://del.icio.us/post?url=<?php the_permalink() ?>&amp;title=<?php the_title(); ?>" target="_blank" rel="external nofollow"><img src="<?php echo bloginfo(stylesheet_directory) .'/images/'; ?>delicious.gif" style="padding:0;margin:0;border:none;" alt="Delicious" /></a>
</div>
<div style="width:65px; float:left;">
<a href="http://technorati.com/faves?add=<?php the_permalink() ?>" target="_blank" rel="external nofollow"><img src="<?php echo bloginfo(stylesheet_directory) .'/images/'; ?>technorati.gif" style="padding:0;margin:0;border:none;" alt="Technorati" /></a>
</div>
<div style="width:65px; float:left;">
<a href="http://twitthis.com/twit?url=<?php the_permalink() ?>" target="_blank" rel="external nofollow"><img src="<?php echo bloginfo(stylesheet_directory) .'/images/'; ?>twitter.gif" style="padding:0;margin:0;border:none;" alt="Twitter" /></a>
</div>
<div style="width:65px; float:left;">
<a href="http://www.facebook.com/sharer.php?u=<?php the_permalink() ?>&amp;t=<?php the_title(); ?>" target="_blank" rel="external nofollow"><img src="<?php echo bloginfo(stylesheet_directory) .'/images/'; ?>facebook.gif" style="padding:0;margin:0;border:none;" alt="Facebook" /></a>
</div>
</div>

Blogger

Go to Layout – Edit HTML, don’t forget to check “Expand Widget Templates”. Copy & paste the code below after <data:post.body/>

<div style='clear:both; '>
<div style='width:60px; float:left;'>
<script type='text/javascript'>
digg_url = &#39;<data:post.url/>&#39;;
</script>
<script src='http://digg.com/tools/diggthis.js' type='text/javascript'/>
</div>
<div style='width:60px; float:left;'>
<script badgetype='square' src='http://d.yimg.com/ds/badge2.js' type='text/javascript'><data:post.url/></script>
</div>
<div style='width:65px; float:left;'>
<a expr:href='&quot;http://www.stumbleupon.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='external nofollow' target='_blank'><img alt='Stumble' src='http://s310.photobucket.com/albums/kk426/magznetwork/socialbig/stumble.gif' style='padding:0;margin:0;border:none;'/></a>
</div>
<div style='width:65px; float:left;'>
<a expr:href='&quot;http://del.icio.us/post?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='external nofollow' target='_blank'><img alt='Delicious' src='http://s310.photobucket.com/albums/kk426/magznetwork/socialbig/delicious.gif' style='padding:0;margin:0;border:none;'/></a>
</div>
<div style='width:65px; float:left;'>
<a expr:href='&quot;http://technorati.com/faves?add=&quot; + data:post.url' rel='external nofollow' target='_blank'><img alt='Technorati' src='http://s310.photobucket.com/albums/kk426/magznetwork/socialbig/technorati.gif' style='padding:0;margin:0;border:none;'/></a>
</div>
<div style='width:65px; float:left;'>
<a expr:href='&quot;http://twitthis.com/twit?url=&quot; + data:post.url' rel='external nofollow' target='_blank'><img alt='Twitter' src='http://s310.photobucket.com/albums/kk426/magznetwork/socialbig/twitter.gif' style='padding:0;margin:0;border:none;'/></a>
</div>
<div style='width:65px; float:left;'>
<a expr:href='&quot;http://www.facebook.com/sharer.php?u=&quot; + data:post.url + &quot;&amp;t=&quot; + data:post.title' rel='external nofollow' target='_blank'><img alt='Facebook' src='http://s310.photobucket.com/albums/kk426/magznetwork/socialbig/facebook.gif' style='padding:0;margin:0;border:none;'/></a>
</div>
</div>

SUPPORT & DISCUSSION

Go to MagzNetwork Support