Add CSS3 Spinning Social Sharing Icons/Buttons Below Every Post In Blogger

Social Bookmarking and sharing buttons helps your blog visitors to easily bookmark or Share your blog content with popular social websites like Facebook, Twitter, etc. This widget is based on CSS3 such as -moz-transform which converts spinning effect to social sharing buttons. Whenever you hover the mouse on these buttons they rotates in slight round and surprise them with their spinning effect method. In this post we are going to show you how to add simple social sharing buttons below every post in blogger. In this widget we added Facebook, Twitter, Google Plus,  Delicious, Digg, Stumble upon, Technorati icons. If you are ready to add these sharing widget below every post in your blogger blog, then kindly follow these steps.

Social Sharing Widget Preview

How To Add Social Sharing Widget

• Go to Blogger Dashboard 
• Click on DropDown Menu and select Template
• Backup your Template before making any changes to your blog
• Now Click on Edit HTML --> Proceed --> Expand Widget Templates
• Press Ctrl + F and search the code shown below

<div class='post-footer-line post-footer-line-1'/>

• Now Paste the Code Shown Below just below/after it

<b:if cond='data:blog.pageType == "item"'>
<style>
p#socialicons img {    -moz-transition: all 0.2s ease-in-out;    -webkit-transition: all 0.2s ease-in-out;    -o-transition: all 0.2s ease-in-out;    -ms-transition: all 0.2s ease-in-out;    transition: all 0.2s ease-in-out;} p#socialicons img:hover {    -moz-transform: rotate(70deg);    -webkit-transform: rotate(70deg);    -o-transform: rotate(70deg);    -ms-transform: rotate(70deg);    transform: rotate(70deg);}
</style>
<center><p id='socialicons'>
<a expr:href='&quot;http://plus.google.com/share?url=&quot; + data:post.url' rel='external nofollow' target='_blank'><img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjV9AqK-5qypWyIY5sDrt0B58u7JcKHy0L99il3gv0DCbdmCjcYEJGZnP5Hjd9oqTuMbM1P6M0C-dn-T3k_sSYF3PpCakgYtRQCzAgYwTdUW2d_APszNXp9-eCWZgrOdzuFrdEtk9QRNLw/s1600/latesthack.com-google_plus.png'/></a>
<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 border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEioA0FYsHSJ-Psq247IgSDyFHby2do5q3w_k1XlCVQH87eMll9dE4UuxPZGE-QGLh_d0v7imoFQNdOCOVID5aMCCrMg06xXOFtxHZ6LnqX8jawrx7LPbPmf3sMTAd9GjxPL8RR3cXPv8Oo/s1600/latesthack.com-facebook.png'/></a>
<a 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 border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiNRipFbzAzVbdmzCC0E5T4yAM6pPUake9XadhBVsyow7uLMdE4qXdO67EJuJZytI3rtyoZPCxngI4AHnpWysT8z9gHq0wE3vlCd1YzrO7g7X_YfDp_fK-2hFselBtwmLgo7wGYiO-nJ3E/s1600/latesthack.com-twitter.png'/></a>       
<a expr:href='&quot;http://digg.com/submit?phase=2&amp;url=&quot;  + data:post.url' rel='external nofollow' target='_blank'><img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgdGpYmMuM_xc5ohDXdM1wtbRid4KkIcBM_sugH6nI35-xFOcMAbr1jACmFGnQnFGGJjZvSR8g2ADCVjy0mfA9UL01Uhgs8Z0r5xncCSY9Q3U6x_vSeXN8VNHfz-jjloYBNz9g9ajrgDxmu/s1600/digg.png'/></a>
<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 border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiYrrA29T2Zuubud8L9CpfTmXDsSvE9noT8ZyX_EVaSOAQwzaFjaYypf1xTxSP9DI5IJaPWVTzRQ0zJZYr7TZnXhi545SBlHgiCXgRU8DWi7NVytUROgQ_f1UOpfGyg06hq6XGCGGoNqjKv/s1600/delicious.png'/></a>
<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 border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhjnE1suFNwqxIzirAi-hhn774TMADU4AlCd3D1v8IhkwfaeXHzpp-WlJPo84hxmeJFpuurCRzPfa0d7RO1jF9x9LDDlDN_qsUebCVe64LQB6iXFjtfKwIW_C0kKo7MB03x1MI_w3QXhZ3w/s1600/stumbleupon.png'/></a>
<a expr:href='&quot;http://www.technorati.com/faves?add=&quot; + data:post.url' rel='external nofollow' target='_blank'><img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiUF7jqhB4F9EzX7im6ATY_z8UU-H2aZItP13EvhH__3IGevTf_2-N-DmeeM0qmfu1Hudq34uDlaN0C4vc5KCTTpSuixNoK9qjGJEopynzPxSMkGIPYPU_kn5kbBA5VoQQMFd8sZMFqDhwl/s1600/technorati.png'/></a></p></center></b:if>

• Now save your template

Like it? Share it.