social share widgetPresenting yet another beautiful social media connect widget that lets your visitors to search your blog, subscribe to your RSS Feeds, follow you on twitter, follow you on Facebook andshare your blog with over 351+ Social Media Networks! This widget is an extracted code from a wordpress template provided by Pbloggertemplates . I have further edited the widget to make it a perfect social share tool. Please see the demo below,

Live Demo 

Adding The Social Connect Widget To BlogSpot

  1. Go To Blogger > Design > Edit HTML
  2. Backup your template
  3. Search for ]]>  and paste the following code just above it,
/*  ————-MBT SOCIAL SHARE WIDGET——————– */
#search{width:350px; border:1px solid #E0DFD9;background:url(http://2.bp.blogspot.com/-L-6BIGrXfyA/TeDn95a4GxI/AAAAAAAAHLg/z1th8GgWvko/s1600/search-bg.png) left top repeat-x;height:32px;padding:0;text-align:left;overflow:hidden}
#search #s{width:80%; background:none;color:#3F3F3F;border:0;padding:4px;margin:3px 0 0 12px;float:left}
#search .search-image{border:0;vertical-align:top;float:right;margin:8px 4px 0 2px}
#search-wrap{padding:15px 0}
.topsearch #search{margin-top:0;margin-bottom:10px}
.social-connect-widget{background:#FFF;border:1px solid #E7E6DE;padding:10px}
.social-connect-widget:hover{border:1px solid #CBCBC2;background:#F5F4EF}
.social-connect-widget a{text-decoration:none;font-weight:bold;font-family:Arial,Helvetica,Sans-serif;color:#4B4D4E}
.social-connect-widget a:hover{text-decoration:underline;color:#F77C04}
.social-connect-widget img{vertical-align:middle;margin-right:5px} 
  • To Change width of search box edit width:350px
  • To change width of search input area edit width:80%
     4.    Then Search for,
PS: In this part most of you will face problems as the coding for each template differ. If you could not find this code then do not panic and simply post your Blog URL in the comments.
     5.   Now Paste the following code just below it,

                       

  
Twitter
Delicious
Facebook
Digg
Stumbleupon
Favorites
More

 
Make these changes:
  • Replace http://twitter.com/USERNAME with your twitter profile link
  • Replace http://facebook.com/USERNAME with your Facebook Profile link
      6.   Save your template and Bingo you are done! :>
Visit your blogs to see a beautiful new change. Hope you liked it. Questions are always welcomed.
Read more :
READ  Hướng dẫn cách đăng kí tài khoản Google AdSense qua Flixya