Add Social Media Sharing widget at top right your blog. This awesome widget was made by Mybloggertricks. If you like this widget, simply follow the step below to install this awesome widget into your blog.
( View Sample Here )
Let's begin,
1) Login Blogger > Design > Page Elements > Edit HTML > Expand Widget Templates
2) Press Ctrl+F and find this ]]></b:skin>
3) Now just copy the code below and paste it Above the line.
/* -------------MBT SOCIAL SHARE WIDGET-------------------- */
#search{width:350px; border:1px solid #E0DFD9;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgICZIqQ4ZFEwbRy1B8c43ZIZ10EOiuTlD7hKU6bUC7aERVE-0tTMcjkTFNj1nnSGYjG7AYtPjlBUqSjUwkU1sAWyBPuAdCI3irEYCSLrBEUtoxKu00ieIIsQVV__cyzd0brbHT4dmWiV4/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) Save your template.
5) Go to Design > Page Elements > Add a Gadget > select HTML/JavaScript
6) Copy code below and paste it into the HTML/JavaScript box.
<div class='topsearch'>
<div class='clerfix' id='search'>
<form action='/search' id='searchform' method='get'>
<input id='s' name='q' onblur='if (this.value == "") {this.value = "Search here...";}' onfocus='if (this.value == "Search here...") {this.value = ""}' type='text' value='Search here...'/>
<input class='search-image' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgq0kD5Jy8bt0FYibZDmU1gBwjA90rJUtwlAOyV7P-VDviCsXoXPzZn4fuxpwRo8HTkYA5mLftj7Z2h2q7c_VzeUYlYCAe5i1v2-1nHW3vrtjkKahf1h25nKITIJlt8KVk7NtyTMyP9RHQ/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 + "feeds/posts/default"'><img alt='RSS Feed' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgvDjQw8l2cMb1uUYMHzb0DZHIDCpAmpL88SUH4t5wFNDyQOfB0KpUtk319VtVJaihLgqYSFVAy6TX3A-xneV8SJq8livPhGM4o5GVsROFIthM4-ZsUWRlaJbm-iPQws7k585YfkGMSwdSz/s1600/social-connect-rss.png' title='RSS Feed'/></a><a expr:href='data:blog.homepageUrl + "feeds/posts/default"'>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/AVvXsEjUbiqf7BkK-rMPNhLPG4favYavIzMnawdFmwqLgC3iVLOGxNcjEcaNAGtNlFcb5cvxZomu0iB6YvnJW_n61DCrK4vEgnqhbMGr7csE__EqMh0_wznU40-9c84OmRQfxJG0QDqHm9KUfHNB/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/AVvXsEimoW_5aBpVuRWuaTSTjJWt9Lp989XNbppKdQkR3AOgR9_1CHcnJUE7lElqp3wLGwFVVoUIBbS1TAIsD8u1XjlFUKDqgo65dKXV-TATP0pRt0DEtXTaOdcPwRI98vBDy2-LcbK3HXYsWVkt/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/AVvXsEiC6h3OzQQLojCeGOQpv_4VY4KLYTwrDYMU-YwNXTCtwx2WaG_NcQ6F2Gqwm2BeeX19q7E7Ys3hGgbA69BSWV14ZFqFHnjGky1l-QWBcTs61pH9TVlks-2Rq811qk_l-XlPIKvD5dF0GHY/s1600/twitter.png' width='32'/></a>
<a class='addthis_button_delicious'><img alt='Delicious' height='32' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj5fmQCkQ9YiS4vK0y5Oah7-iS4mSNIKEClL2bYYkZ2DGyu4en6WAw0p5XjBSRR2Wz1C2_1p479TkamOiMwb2qw32rGhNglsy-w8YXlxPfHSYL0LlQ7FSK5BG0bO95r2hkZq9JCmAk1uFs/s1600/delicious.png' width='32'/></a>
<a class='addthis_button_facebook'><img alt='Facebook' height='32' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjB6piHf1nVUHbOsqh9F9Ht7_UjKqyhNhfqRmcR5NNK-0Mfm94MX4WphE0SH2nSzSJGpPkew49zoxczGagTfLGQwMI4joQJts_K6DmgA_EZamxVmrHG8G1iPEZjNDAhSDKI2Cd_8k0d6Bs/s1600/facebook.png' width='32'/></a>
<a class='addthis_button_digg'><img alt='Digg' height='32' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgqQRjHbvct-p9bAGDL2rbNTtwJpO9utJ6wgNx50vq6OJRBw2xQuxiI8cYxo2Ze-hbnEwqPhmxjsq5utxsi-B1q5EhJosTKw7DC2hK28cPeIIwBH0hp55-M3eJYwZUeYME9Kr6Dg8EDcmg/s1600/digg.png' width='32'/></a>
<a class='addthis_button_stumbleupon'><img alt='Stumbleupon' height='32' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg8rUiq-TdK2DZ-fszIWm_MFaM10G-i2kIk4KdgqCtvW_g-LE3PtFy_0Kz1ZkRZHbEWbCxitGfce4pm-xc1XoTXYoq9C_Erymjn7tXVAoh59ST7BcMWbA8LzLTw9vY9Obv7PIBaBREUW50/s1600/stumbleupon.png' width='32'/></a>
<a class='addthis_button_favorites'><img alt='Favorites' height='32' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhswdrBsHa3tyBrrc45CgZ2USdQzz_sOAkTNMZO4lo9w15C8BjtFZTNzgNBZ2VqZwnti9NaNZGS8z-cYbw5xYhYJcbd9hXMHHJ7J8yxkqVrWEk7ddYBRDat1FPivnLdpXaX5Ks8NUfD-Zw/s1600/favorites.png' width='32'/></a>
<a class='addthis_button_more'><img alt='More' height='32' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgwmRgEsZq2lbOVoIxDf_m2zFSB_o9wkj7GqHpSbfUA5sjHb_69TILDJ9fuFfVft4kBHWu4ZaEa7iLnS-Amdfrku_iPyqfZKqTdSFvcMiP44-yukK4LE58dKg9t0gszC7JdrvbWISBQXwg/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
7) No need to set any Gadget Title, just leave it blank. Then, click Save.
8) Just let the gadget stay at the top right placed, don't move it.
9) Now your widget ready. View your blog.
** This post was originally posted by Mybloggertricks but we do some modification at placing the (6) code.
Have a nice day!
.
OR
Pick a 
3 comments:
cool widget for your blog.
All You LikeHi there, I discovered your web site via Google even as looking for a similar topic, your website came up, it appears to be like good. I have bookmarked it in my google bookmarks.
yes, thanks..
Post a Comment