Social Media Share Widget For Blogger

Presenting a very cool subscription widget! As we know social media is the best one to pull traffic, and this widget is the best to start pulling traffic. This widget is very cool designed as you can see the image at left. This has a search bar, link to your RSS feeds, link to your blog's Twitter Profile, link to your Facebook Fan Page and share buttons that share the page the visitors are in. As per my results this widget is one my favorite widgets ever. 

ADDING SOCIAL MEDIA SHARE WIDGET TO BLOGGER!

1. Log-in to your Blogger account and go to your Blog's page.
2. Now navigate to "TEMPLATE" > "EDIT HTML"(Please Back-Up your template)
3. In the "HTML EDITOR" find for ]]></b:skin> 
4. Just below ]]></b:skin> paste the below code-

/*  -------------Blogger Tricks Hut SOCIAL SHARE WIDGET-------------------- */
#search{width:350px; border:1px solid #E0DFD9;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhxIFBtf6wbupEKNCwqhv-1HmF3IC0Jlo-E5QQHZ6sbSskfb6ccDz1OXdIRtmOvi2GBKYgjShEMeADjs2PquFfU3-PmOp2SsUVwyfvchSnqAYBQWDilqK85VqPeF82nHAMO0efcrVM_GUo/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. Now search for:- <div id='sidebar-wrapper'>
5. Just below the above code paste the below code-

<div class='topsearch'>
<div class='clerfix' id='search'>
    <form action='/search' id='searchform' method='get'>
        <input id='s' name='q' onblur='if (this.value == &quot;&quot;) {this.value = &quot;Search here...&quot;;}' onfocus='if (this.value == &quot;Search here...&quot;) {this.value = &quot;&quot;}' type='text' value='Search here...'/>
        <input class='search-image' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEitMa-y9GPJ20x2L3ZlCxGWWPBAYy13sy7LD0SvjxY8wWMeGpBVVt9gvYkRnBWSevLuMrsmEtND-HZTFQlAYwqR3_Mw0yXL0VNPVywxtpAK8W8vqaO1K8x6I1rwk2rOTL-mAckSVj6MOHQ/s1600/search.png' title='Search' type='image'/>
    </form>
</div>
</div>
<div style='clear:both;'/>

<div class='social-connect-widget' style='margin-top:0px;margin-bottom:10px;'>
<a expr:href='data:blog.homepageUrl + &quot;feeds/posts/default&quot;'><img alt='RSS Feed' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLDO4jNdTKo8QJpD8omwxmxKY30pmrPtGLmPehDr0pV8DPJYStX8f3a9JQW2rSaPiFx_wltRRvscJBWOV4d5XupVGhtnlVC9ot6SxuckprJkYXXrlE4bCv6QibaGA0Hwg4dqAp1oIcTYRo/s1600/social-connect-rss.png' title='RSS Feed'/></a><a expr:href='data:blog.homepageUrl + &quot;feeds/posts/default&quot;'>Subscribe to our RSS Feeds!</a>
</div>
                       
<div class='social-connect-widget' style='margin-bottom:10px;'>
<a href='http://twitter.com/USERNAME'><img alt='Follow Us on Twitter!' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgqbYNIU4vwfFUVzAEnt49sU2iP7TmP0Zpn1pIlGyqwK1IFF1E3mDswUk_byfT7oGTQoASakqA2y_-mf3naG0gEYUc_yUj7i9RwoeafvfrLalKg2Nb6SWHcBDrfPyEQAGZigCTntkBHHH4h/s1600/social-connect-twitter.png' title='Follow Us on Twitter!'/></a><a href='http://twitter.com/USERNAME'>Follow Us on Twitter!</a>
</div>

<div class='social-connect-widget' style='margin-bottom:10px;'>
<a href='http://facebook.com/USERNAME'><img alt='Be Our Fan!' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi6ePaY5L4PdbxiO8H6iLxYJ6nUhXIZTQTrn8-lq2P71o22w34H-hQPIzoNWJdlveD9lJ_mMCdUQYTC4dWrOSXEPww525DsuhIhUCvLBzSwRE4zeAKhvh200ySOWVXx-47DAILCr4x3Dqjq/s1600/social-connect-facebook.png' title='Be Our Fan'/></a><a href='http://facebook.com/USERNAME'>Follow us on Facebook!</a>
</div>

<div style='clear:both;'/>

<div class='addthis_toolbox'>  
<div class='custom_images'>
<a class='addthis_button_twitter'><img alt='Twitter' height='32' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiRXF_mMjWJGl1X-qJGHqJSD5xpCi8w5P82VLMlXrxEv4IS-49szmY7e3WjGZfwOUheUnXOTRB7TBYGQz98MC7Oek77xCPQVZ_Zvj0SQjQaDDj8qdI-nncmHyTqhiOaX8CkOf_wqZXP5oA/s1600/twitter.png' width='32'/></a>
<a class='addthis_button_delicious'><img alt='Delicious' height='32' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3oEnDNyPhZcNDJHQBH6Z9L4p3J4z3_wUyIg2Ctxh-NZRA6fbDHpN_zgJcvTLhTuHJ-J477TikuDy-Ha5mPETlHR9LlNbBJFijIygiNI49g-dOTvcg1OlYntfcvVvevOfzDci2SZRXeoI/s1600/delicious.png' width='32'/></a>
<a class='addthis_button_facebook'><img alt='Facebook' height='32' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj3jR-GmPhtmkMVC_vWE2BCFC7tb9Gls5L1TPF2AXzK6mfYbnMgDHVq3zwhN-2EXGxV8HOvwTBC5bVRx2lmaBpDSQsL4ZNJ8A1uu1d5kN1jSg_aYOlu1NYiwwZ4R8Z2xf6E_hotvPl3IsE/s1600/facebook.png' width='32'/></a>
<a class='addthis_button_digg'><img alt='Digg' height='32' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgSpyZ0LVy55JC2Nin0wh3Vhnct3lhgshX1IrZ6jOpMwj9eEFfydn1okuvTZCg82OpisBzpRVJnw51IGJWHdije9swIizOHOOJsbWNFlnB_R-YZecipZnTwbU5ulq5xXjlirMuuedMvSEw/s1600/digg.png' width='32'/></a>
<a class='addthis_button_stumbleupon'><img alt='Stumbleupon' height='32' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiTYYE4zeXsCCG6wTHRmxSjdeX9KUyQHDjIKgygyzZbuDFxbIGA13ZfALiMznvhzOFc2R9O8HCKZPRF-YyZn3gLGm07x3_eOstD3IkY6y6J0SAvja1d_NEVFuHGvUQGvA-m3dEoC7rrpH4/s1600/stumbleupon.png' width='32'/></a>
<a class='addthis_button_favorites'><img alt='Favorites' height='32' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiWK1yXpF1Bco3n3CyjmCogYvsN98NO6DWZqP5Qw9eL1vu18F8Pa-twQqrNByJM3kJpC9KE-76IP5JKV-RlqxJax10kk9r4ASK9mCM4Y6UJfG2ocu2CvgqhUDJ8MbpXMAGA12Aoocy6R5A/s1600/favorites.png' width='32'/></a>
<a class='addthis_button_more'><img alt='More' height='32' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhjudLMhZJw4tdcq5cbCsl_HpTvlRRAfRturhWjX98q58yRJteYgsBymOyx-ns-LuoMVU7XEWEcskR6hZWCiPzTZJXyNCVqr1QBKVXWfgcMzjSauNrT0p8Hh-p2YgVEXxG02uKSxK6J1cE/s1600/more.png' width='32'/></a>
</div>
<script src='http://s7.addthis.com/js/250/addthis_widget.js' type='text/javascript'/>
</div>
<div style='clear:both;'/>

• Replace http://twitter.com/USERNAME with your twitter profile link  
• Replace http://facebook.com/USERNAME with your Facebook Profile link 

Now check your blog and see your super changed blog. For more great tutorials stay tuned to Blogger Tricks Hut. Happy blogging.