Simple Social Media Like Us Box Widget

Simple Social Media Like Us Box Widget
In this tutorial i'm going to explain how to add simple social media like us widget and gadget for blogger/blogspot.it is very easy to use and very elegant look,this widget have facebook,twitter and subsribe on rss buttons/icons.





1. Log in to blogger account.
2. Now select "Layout"
3. Click Add Gadget and select 'HTML/Javascript
4. Paste below code
<style type='text/css'>
#topbox{width:250px;border:4px solid #a1a1a1;background-color:#ffffff;}
#topbox:hover{border:4px solid #4e4c4c;background-color:#ffffff;}
#social1 .social2 h2.subscription { border:0; margin:0; padding:3px 0 0 55px; height:42px; font-size:14px;font-family:&quot;Segoe UI&quot;,Calibri,&quot;Myriad Pro&quot;,Myriad,&quot;Trebuchet MS&quot;,Helvetica,Arial,sans-serif;
font-weight:bold; }
#social1 .social2 h2.subscription:hover {color:#1c5ef3; font-size:15px;}
#social1 .social2 h2.facebook { background:url(http://4.bp.blogspot.com/-QY6ocJ_AM8U/UDzCtjNrQaI/AAAAAAAABHs/C2nOr_j6AgE/s1600/bloggertrix-facebook-icon.png) no-repeat top left; }
#social1 .social2 h2.twitter { background:url(http://3.bp.blogspot.com/-SLrdL9-9MPU/UDzCuibOh7I/AAAAAAAABIE/hYoGKxXG2UY/s1600/bloggertrix-twitter-icon.png) no-repeat top left; }
#social1 .social2 h2.Rss { background:url(http://3.bp.blogspot.com/-Xgbqazryl3E/UDzCuE8sOSI/AAAAAAAABH4/laXMBBCXuF4/s1600/bloggertrix-rss-icon.png) no-repeat top left; }
#social1 .social2 .subscription a { color:#252e28; text-decoration:none; }
</style>
<div id="topbox">
<div id="social1">
<div class="social2">
<h2 class="subscription facebook"><a href="Facebook URL" target="_blank">Like On Facebook</a></h2>
<h2 class="subscription twitter"><a href="Twitter URL" target="_blank">Follow On Twitter</a></h2>
<h2 class="subscription Rss"><a href="Your Email Subscription URL" target="_blank"> Subscribe On RSS</a></h2>
</div></div>
</div>

  • Change Facebook URL with your URL
  • Change Twitter URL with your URL
  • Change Your Email Subscription URL  with your feed
5. Now save your 'HTML/Javascript'. Done !