Social Sharing Widget Below Post With Hover Effect

The most special and trusted way to promote your blog is social media and when we are talking about social media promotion the it means it will not worth you a single penny.In these days social media is helping the new and old bloggers to promote their blog so that more and more visitors will get attracted.Our promotion method is also same, and when are talking about social media promotion the it need to install a quality of widgets so that every single visitor of your blog could easily interact with you and your blog so came with our first widget for blogger "Social Sharing Widget Below Post With Hover Effect" you could easily found these kind of widgets in blogger sphere and this is also not a unique one but it is super fast in its categories,it loads in seconds cause it has the hover effect which is supported by a very simple but effective css coding. First check out its live demo.

Live Demo

© Skillblogger™

Click to See

Features of This widget  

• Supports almost every browser
• Super Fast Loading,loads in split seconds
• Very easy coding and easy to install
• It will not affect the blog speed
• looks cool and stylish

How to install this widget

These is steps are so simple and easy that every new blogger will not face any kind of problem to install it in their blog.

• Go To Blogger.com >> Your Blog >> Template
• Now Backup your template.
• Then select Edit HTML >> Proceed
• Don’t forget to Click/Tick the Expand Template Widgets box.
• Search for ]]></b:skin> and just above it paste the following  CSS code.

.Social img {
filter:alpha(opacity=100);
opacity: 1.0;
border:0;
}
.Social:hover img {
filter:alpha(opacity=30);
opacity: 0.30;
border:0;
}

Now let’s add the final and important part of the widget, Search for <data:post.body/> and just below/after it paste the following coding.

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<br/><center><span style='color: #333; font-size: 12px; font-family: Verdana;'><b>Thanks For Making This Possible! Kindly Bookmark and Share it.</b></span><br/><br/><br/>
<!-- Technorati -->
<a class='Social' expr:href='&quot;http://technorati.com/faves?add=&quot; + data:post.url' rel='external nofollow' target='_blank'><img alt='Technorati' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhdlf5cQr5zAOTFTJ5c7sLJy24vMyHOBh8dqP3XVWRv79UPXL3ul6UrlsbF8MYYd4hIR3TpvcE8roMJXucgBrAZ0VxITw7xOiGC9fLp_GvZQjNoci9kgGW2NhvSH0_4Pk0_3loanoSCf7A/s1600/TAG-IT.gif '/></a>
<!--DIGG-->
<a class='Social' expr:href='&quot;http://digg.com/submit?phase=2&amp;url=&quot;  + data:post.url' rel='external nofollow' target='_blank'><img alt='Digg This' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg8A6TBAhAfmf3dvT1l1cfAAxwgr7VXsp-u6XGs6dNn2Heo6FVfJ6TauFrtZDZB17h5XQdS2br0TIuPi4ONmb2dT6dvMReX2S8Yh6U67IofZPi23Hyd4Ji5Edpw0DxbMhU1U4gcXs4354s/s1600/Digg.png '/></a>
<!--Stumble-->
<a class='Social' 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='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjxUUYgpIngi4w0HW2ITkXplV89HwkSN2ucndgW-4vvS1Z2EbDvr-traHXEoBot-WsakE3XfrodYDaBeUDrf_48bZAHTkqXUQh-G66bRljKiHUCKFjhvv_-WgrTNVWP9_D-DlwXVqROsCE/s1600/STUMBLE-IT.gif'/></a>
<!--Facebook-->
<a class='Social' 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='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh8fIwTzrDJeIZylkoQ57iq-HphkS2lU-G7oV428Khkhl74kYN9pSGXJVZ9gugu44NfqX4v0vcoy-PG2IHzs-wdw6_S2L9NWYrj6EiA1rAHdd7pjLbtwuZ3IkiFOSS7fTQf25x4OrVCwCg/s1600/facebook.png '/></a>
<!-- Twitter -->
<a class='Social' expr:href='&quot;http://twitthis.com/twit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='external nofollow' target='_blank'><img alt='Twitter' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjIfCd1h_WyfPnVVV1rMRlJh8_Tfden96B8TcQiEUWtDAFwSw_a5u1K1kurj_pSifxDVofQLIEfS_DFAYrZv8-Oz96gqL0eWlkHdvXaaTBMmUe-OCBAt622WRZ_yx_oV3l-ylNpeXdqYiM/s1600/TWEET-IT.gif'/></a>
</center> </b:if>

All Done : Now everything is completed just  Save your Template by pressing Save template button

From the Editor’s Desk:

Hope you have enjoyed the cool and interesting session  of Social networking. we are trying to create more widgets that benefits to you and your users. A very famous blog has used this widget If you would face any problem to add this widget feel free to ask till then, blessings and happy fading.