Add floating social icons to blogger

Socials icons are very important for every blog. They helps in increasing the social presence of the blog. By using these socials icons blog visitors can subscribe to blog updates on their social networks. Thus this widget helps in increasing  blog traffic also. This guide is about adding stylish floating social icons to blogger blogs. These social media icons are fixed floating type. They remains fixed on left bottom of your blog whether you scroll up or down.


4 FLOATING SOCIAL ICONS



                                   
                                  FOR DEMO LOOK AT LEFT SIDE OF THIS WEBSITE

·                  Open your blog layout from the the blogger dashboard.

·                  Now click on Add a gadget page element.

·                  Select HTML/JavaScript widget.

·                  Paste following code in  HTML/JavaScript widget and save the the widget.

  NOW !! REPLACE #### IN CODE WITH YOUR OWN IDs

<style>
.wcfloat-icons
{
left:0px;
top:200px;
position:fixed;
z-index:10000;
border:1px solid #dcdcdc;
border-radius:5px;
padding:5px;
}
</style>
<div class="wcfloat-icons"><table border="0" cellspacing="0" cellpadding="1" width="34">
<tbody>
<tr>
<td valign="top" width="34"><a href="####" target="_blank"><img src="http://3.bp.blogspot.com/-KjMedajdI2w/UTtUCEg5_zI/AAAAAAAABcQ/K3qUhvOTNrA/s1600/feed.png" title="RSS feeds"/></a></td></tr>
<tr>
<td valign="top" width="34"><a href="####" target="_blank"><img src="http://2.bp.blogspot.com/-7_3aMhrvLq4/UTtUB9H5ZyI/AAAAAAAABcM/JjZGcP7r3_I/s1600/fbb.png" title="Liked us ?"/></a></td></tr>
<tr>
<td valign="top" width="34"><a href="####" target="_blank"><img src="http://2.bp.blogspot.com/-VXfOkCT43uI/UTtUEItlzyI/AAAAAAAABck/cvROEjW1Vx8/s1600/tww.png" title="Follow us"/></a></td></tr>
<tr>
<td valign="top" width="34"><a href="####" target="_blank"><img src="http://4.bp.blogspot.com/-vnYX9pKHZCU/UTtUCWa3-HI/AAAAAAAABcU/Xi7l4YF136U/s1600/gpp.png" title="Circle us"/></a></td>
</tr>
</tbody></table>
</div>

 ***----------------------***---------------***--------------***-------------------***-------------***                


4 FLOATING SOCIAL ICONS (WITH DETAILS)

·                  Open your blog layout from the the blogger dashboard.

·                  Now click on Add a gadget page element.

·                  Select HTML/JavaScript widget.

·                  Paste following code in  HTML/JavaScript widget and save the the              widget.

<!-- Scrolling social Button BEGIN --><div class="addthis_toolbox addthis_floating_style addthis_counter_style" style="left:50px;top:50px;"><a class="addthis_button_facebook_like" fb:like:layout="box_count"></a><a class="addthis_button_tweet" tw:count="vertical"></a><a class="addthis_button_google_plusone" g:plusone:size="tall"></a><a class="addthis_counter"></a><a href="http://pcandbloggertricks.blogspot.in/">Widget</a></div><script type="text/javascript" src="//s7.addthis.com/js/300/addthis_widget.js#pubid=ra-508240f16db23831"></script><!-- Scrolling social Button END --> 

 ***----------------------***---------------***--------------***-------------------***-------------***

5 FLOATING SOCIAL ICONS

·                  Open your blog layout from the the blogger dashboard.

·                  Now click on Add a gadget page element.

·                  Select HTML/JavaScript widget.

·                  Paste following code in  HTML/JavaScript widget and save the the widget.

<!-- Scrolling social Button BEGIN --> <div class="addthis_toolbox addthis_floating_style addthis_32x32_style" style="left:50px;top:50px;">

<a class="addthis_button_facebook"></a><a class="addthis_button_twitter"></a><a class="addthis_button_delicious"></a><a class="addthis_button_pinterest_share"></a><a class="addthis_button_digg"></a><a class="addthis_button_orkut"></a><a class="addthis_button_google_plusone_share"></a><a class="addthis_button_myspace"></a><a class="addthis_button_compact"></a><h6><a href="http://pcandbloggertricks.blogspot.in/">Widget</a></h6></div><script type="text/javascript" src="//s7.addthis.com/js/300/addthis_widget.js#pubid=ra-508240f16db23831"></script><!-- Scrolling social Button END -->