Social share icon for blogger

Social share icon for blogger

Social sites are play most important role to fetch a lot of traffics on your websites. Here i am giving you a floating widgets for your websites or blog, It's really awesome.

Live demo

Html and CSS Code 

<!-- Social media share button left side-->
<style>
#socialicons img { -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; -ms-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out;} #socialicons img:hover { -moz-transform: rotate(360deg); -webkit-transform: rotate(360deg); -o-transform: rotate(360deg); -ms-transform: rotate(360deg); transform: rotate(360deg);}
</style>
<div id="socialicons" style="bottom: 1%; left: 1%; position: fixed;">
<a expr:href="&quot;https://www.facebook.com/sharer/sharer.php?u=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title" href="https://www.blogger.com/null" rel="external nofollow" target="_blank"><img alt="facebook" class="bookmark-icon" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzJsVU_NGWveXqlrwoTqTooCf7CdZGvi-CTyDuxKTIEvyKs4XcOXf7KZ5oMVXTCRR5xDcWnyRI4fp-v9Xk07nbP_2zy9rHidgNahwXopnm51CIj4p7EGSYCL4ceCgLNPwGDeOvmjSiYQRI/s1600/facebook.gif" height="55" style="background-color: transparent; background-position: initial initial; background-repeat: initial initial; border: 0px;" width="50" /></a>
<a expr:href="&quot;https://plus.google.com/share?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title" href="https://www.blogger.com/null" target="_blank"><img alt="google-plus" class="bookmark-icon" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEigfkToQWhWaA6ewyPAKFrY6o4ATvgkUbxPY4LKqouQTgKxnRpudfX1sW-nksdWHw9RWvuBNO8Ah2-6pPXuc1pdeA3Y6Uxpmddu14c7Y_wOE74ozJaV5rS2taV6-vJ4NuRl_q4Vm9mfV75U/s1600/google++black.png" height="55" style="background: transparent; border: 0px;" width="50" /></a>
<a expr:href="&quot;https://twitter.com/home?status=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title" href="https://www.blogger.com/null" rel="external nofollow" target="_blank"><img alt="twitter" class="bookmark-icon" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEidYiwqNQVCRMmG_f5Dm0nRTE8032x2zC4lNy4YuQaacGlwAQjvd8uHnkCV57epPIHI_u_cZMiO3rwxahznLG6tZouAfVSmWdrMeQJhkT2gHNw8oTvUOMYfDckqKokRI6FS0UIOcc4WRJYs/s1600/twitter.png" height="55" style="background: transparent; border: 0px;" width="50" /></a>
</div>
<!-- end Social media share button left side-->

Copy and paste above code on your blog and websites.