Add Fancy "Share This" Social Bookmarking Widget to blogger

• 
• 
• 
• 
• 
• 
• 
• 
• 
• 
• 
• 
• 

Here’s a cool new social bookmarking widget for your blog, with on-hover animation effect. By adding social networking icons to your blog you will definitely boost your blog’s traffic.
To see live demo : Demo 1
Step 1: Firstly, Log in to Blogger. Now go to “Design” and then click on “Edit HTML” tab.Then download the present template as a backup.
Then Click on “Expand Widget Templates” checkbox. ____________________________________________

STEP 2: Now find [CTRL+F] this code:

     ]]></b:skin>

 ___________________________________________ 

JUST ABOVE/BEFORE THIS CODE, paste the following code:

/* Fancy SocialBookmark*/
 
#sharebox{
height:48px;
width:400px;
margin:0;
padding:5px 0;
}
 
ul.sharebox { margin:0px; padding:0px; list-style:none; position:relative; display:block;}
ul.sharebox li { float:left; margin:0 0 0 0px; padding:0px; position:absolute;}
ul.sharebox li a { margin:0 0 0 -24px; display:block;}
ul.sharebox li a:hover { margin:0 0 0 -8px; }
ul.sharebox li img { border:none;}

_____________________________________________________

Step 3: Now find (CTRL+F) this in the template;

</head>

______________________________________________________

And immediately ABOVE/BEFORE that paste this code

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/>
 
<script type='text/javascript'>
(function($){
$.fn.sharebox = function(){
var element = this;
 
$(element).find(&quot;li&quot;).each(function(i){
$(this).css(&quot;z-index&quot;, 12- i);
if (i&gt;0)
$(this).css(&quot;left&quot;, i * 24 + 100);
});
 
}
})(jQuery);
</script>
<script type='text/javascript'>
$(document).ready(function(){
$(&quot;#sharebox&quot;).sharebox();
});
</script>

 __________________________________________________________

Step 4: Now find (CTRL+F) this in the template

   <data:post.body/>

___________________________________________________________

And BELOW/AFTER that, paste this code:

<ul class='sharebox' id='sharebox'>
<li><img alt='Share this' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEileoSbNGlAG8bxZhL0bvkf8TzyWYyc4a0FtxggDYnZ4VeLSGLbToGriJTn-UgFZnDRV6zTedfN3i6xHZSUAwOYhRgPtB1s2N4tEZwQCYzrgS38wkyBJTUxfyGFIqi4r9CyIUEOiyWNkFI/s400/sharethis.png'/></li>
<li><a expr:href='&quot; http://digg.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'><img alt='Sumbit to Digg' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhCq4HyZDExxdeRwgZXs2pZKIkEzaUDnPhzNlgzaduHR-ena7Jldf7nhfOBAFt-0BBzuL4hwr7RByBI_hbMlMb6v4WfL_eWV9IlrKUFBlmKCmW00mo61KFxeDIXweTNPxDhkv6tWq9vp2w/s400/digg_48.png'/></a></li>
<li><a expr:href='&quot; http://www.stumbleupon.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'><img alt='Sumbit to StumbleUpon' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhlq8S247u5rWHQy69brmI5Mj6ytASqoeludb80C4v4L5D9IoyqHee2qXtE_jTRZ3AkRFSTZNEUrPwTiwGWiwmFX6sWJBWjpTHiCtoFU3IcfGxVF76PV_S_EZa7ZF6vKDKhKGVranXGE74/s400/sumbleupon_48.png'/></a></li>
<li><a expr:href='&quot;http://del.icio.us/post?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'><img alt='Sumbit to Delicious' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJdbobXnJB6-01GJScRAVSvMPa9crIHGhOmlztuN37LRGoAk7RFHGUwWiYmhXZex6_sIuohCs1WlTIdiQFVB71Q9tjAxavzqOnEfxLM2HDz4QBFxsSMXigIy1iETDHJaAAKWOrEqz9Wd8/s400/delicious_48.png'/></a></li>
<li><a expr:href='&quot; http://technorati.com/faves?add=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'><img alt='Sumbit to Technorati' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEggHMriCFyw2jvP47cRyH2IK4fnCbYJ5DTHFQtECSRy-hkRTTbEgr_0R5A6tVx-zyscSSrIEEIrXhNjqyHE8fdtpr9db2V2Ex36ujUAsKkrH8tV8_jIHSOlZ-76uLvJg5HeGC6JaUFAiJo/s400/technorati_48.png'/></a></li>
<li><a expr:href='&quot; http://www.reddit.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'><img alt='Sumbit to Reddit' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhhXlDUb__T0L2IYJxQhvxVPUN0GL-eqpZr9VVs0uPG7oKT2pIe5_3TP82aKws14Gi46PTFZRJrS-Co2dFltUx3I5AHrqw3Aj3ax4C1i3P352-Lx7yg84K_CNR0YN5JfMo2WMu-g8Movbc/s400/reddit_48.png'/></a></li>
<li><a expr:href='&quot; http://www.mixx.com/submit?page_url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'><img alt='Sumbit to Mixx' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEij1Hp6X3wWpgcxyIHd7I6Iy7x6g7cZNHvtXNCyltlJLYw3QgxOhv7VUOu9TisiGRAGX1FA4JPL_9-fv5h_IDv9AETeVz-NbO3Fxfv7VXUzSiLPHcK-7bSDir7t8NVXmZd54WR_JCevqo0/s400/mixx_48.png'/></a></li>
<li><a expr:href='&quot;http://twitter.com/home/?status=Chk Out-&quot; + data:post.title + &quot; &quot; + data:post.url' target='_blank'><img alt='Sumbit to Twitter' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg86e5TMENgq9P5a1xT9n-XWEGe6EUzDIeTissISk31guAhh0_Qt4eLAx_snotDYTiPDDEyg1iWBJMFKo-t7gEAnMGATkln8y-7x141qNclWFJZEAg0fc9bSpjZRgCowhpqlt1hHvYLMLc/s400/twitter_boxed_48.png'/></a></li>
<li><a expr:href='&quot; http://www.furl.net/storeIt.jsp?u=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'><img alt='Sumbit to Furl' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj96YYiMOJNgiv6VF7JR-4WhEc15AXYCOv56Gwnfjx0FydenDU5MIwtDxScZXv6eni1w8sKD3nSFsDKG-CSHVM-HgGiBC_ak86qGtZU9xi_m4h1iUrTFyjyd_WzWEizsyTQQEpGDDYhNnI/s400/furl_48.png'/></a></li>
<li><a expr:href='&quot;http://www.designfloat.com/submit.php?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'><img alt='Sumbit to Design Float' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhyDfIAVuxbUAOqqH1Ezi1rVQr5HCqJ9QS63nBfa5kBXE3tN3Wn3bDx-XX6St5e4WhV_7x90ymdt4vyjfSAt-44wx2V1l3yuSh6QuvzafNnc7Wez2lpyuRbkkRV7rEjpjKXkY9vTu-mkcI/s400/designfloat_48.png'/></a></li>
<li><a expr:href='&quot;http://www.blinklist.com/index.php?Action=Blink/addblink.php&amp;Description=&amp;Url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'><img alt='Sumbit to Blinklist' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGlJ_Jt4uTKRFzuXUr9W-6cNKJhetwZZG8vsYp_NGPTYHGU_gtX_KGOvy0mT-S57hXwnX15eQTJ5MCwzcIVuae0vaif9bcGYOdX4HrkHKwnmfM8khqmbodR2WmIKUx6C_EcCMt58DKBEE/s400/blinklist_48.png'/></a></li>
<li><a expr:href='&quot;http://buzz.yahoo.com/article/&quot; + data:post.url' target='_blank'><img alt='Sumbit to Yahoo Buzz' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhqbtc7RNWrq6W7zrlMvBokoBltshUf2JR7bn9wYoBa1qfXykK2V62InQdtUCybWfNnDgTdK_hqyhgbzvbYCTr8-nVlpnPy2yH9k97A0WFxmJVn2NeIE1m47fmklPQA3wNtVFSFbRJB4e8/s400/yahoo_48.png'/></a></li>
<li><a expr:href='&quot;http://www.google.com/bookmarks/mark?op=edit&amp;output=popup&amp;bkmk=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'><img alt='Sumbit to Google Bookmarks' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEikWAZL4HBROX51iNIBmV0-VA_iw2yWWQjWDu0IgnKvWGs1pMVzO5HiEHxTPduPt3yoMjDdOtpTF04Xx7H8nkhnWEEMNNhBrz_JI6_roReU6a8Q5U_dRhG_NEosdQHc9QZU37lZEodpErE/s400/google_48.png'/></a></li>
</ul>

______________________________________________

Step 5: Now save the template.

Courtesy: themeblogger-noi

Posted in: How-Tos