This is a New Floating Social Bookmarking Widget For Blogger.This Widget contains Social Sharing Buttons Of Social Networks Twitter, Facebook, Google+, StumbleUpon and Pinterest. It's Also Integrated this with Add This Plugin So, now Start Sharing Your Blog to Social Sharing sites. OK Lets see How to add this social bookmarking widget for blogger.
HOW TO ADD THIS SOCIAL BOOKMARKING WIDGET ON YOUR BLOG?
It is Very Easy to Install this widget in your blogger blog. To add it just follow the simple steps given below.- In Dashboard Go to Template > Edit HTML Button
- Ignore the Warning and Click the Proceed button
- Then Click Expand Widget Templates
- Search for
<b:includable id='post' var='post'>
- Below that place the following code
- <b:if cond='data:blog.pageType == "item"'>
<b:if cond='data:blog.pageType != "static_page"'>
<style type='text/css'>
/*<![CDATA[*/
#btnt-social { bottom: 10%; margin-left: -50px; position: fixed; }
#btnt-social ul { list-style: none;clear: none;padding: 0px 0px ;margin: 5px 0;}
#btnt-social ul li { display: inline;background:none;margin:0;padding:0;}
#btnt-social ul li a { display:block; width: 32px; height:32px; margin: 5px 0; }
#btnt-social ul li a.twitter { background: urlundefined"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg90AvA-UDU5H5S9S_TywHluE5HYQqvhy6av5gTHRxQvjTmVOGfQfrQ_POlifKu8jUXlqy4_EFCvAwGOFvwL9COsmv5vgG4h6CPUKIpcbKM1gnJph2XN8o-Ym3iEgKZqNTv8u9kMg6nGhBc/s32/twitter.png") repeat scroll 0 0 transparent; }
#btnt-social ul li a.facebook { background: urlundefined"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjrVQRvQeebrbdGipvR5Cd2oBAgzfL2ypeZ-_svGRpRQdOQxWGzE_kBoEpBHrXsRGH3JM_p4CLRDphCNLCGSA4uiopNkIREAcIOf3pbYusP4cSbki0UPbRFu_FidtqTFnO8CsBFKL569B4G/s32/facebook.png") repeat scroll 0 0 transparent; }
#btnt-social ul li a.stumbleupon { background: urlundefined"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgtPsWIsfeahU-6iyIcrftamGcN74En1bcFzo14sP-E4Ayisi31kQkz3o3nRloWUCSL0zxsPRTWsrWsJdcUZXHKm1iQWgkbVihHO60TAFyGkAPP2vZVz6TopMeuEVJGkJQiwlsGJM7hEJB0/s32/stumbleupon.png") repeat scroll 0 0 transparent; }
#btnt-social ul li .google-plus { background: urlundefined"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjqlG7VoLWEx46w_lPH8WOQhISMzvhBk4fZtGeincH2RWFDY2zBEJibwqipim2MLOqrE1OE47cYThURYqrBTE1Fm1scX1sK58k6xfg0Ufzu29LbZxXaaAcNAcx2pLvo0L_i3W7jwHsNhomv/s1600/g-plus.png") repeat scroll -1px 0 transparent; }
#btnt-social ul li a.pin-it-button { background: urlundefined"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiQ_dxIJl0f-d7XsNoUFTpqMGyqMf4kp6P_Syc_a2iyh0Ailuph4u-Bq7JSx_sp5VC3So7k3J6Dac1AkoUqswpitFhgjPUDPHK3WMpaYwG1V4fUepoJ7OR-LZF-2pilICuc-9cGrCa_0WAu/s32/pinterest.png") repeat scroll 0 0 transparent; }
#btnt-social ul li .addthis_32x32_style .dummy .at300bs, #btnt-social ul li .addthis_32x32_style .at300bs, #btnt-social ul li .addthis_32x32_style .at15t { background: urlundefined"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjTC6JlLFShTY34bSVNSvsZyn_pGmzjVrChr4-YJYaF_KWEEK4Om2blu1nUiX-k-4FVdDjuHoczuYeOsQh5TlU9ayG-0GdRjygMFDfEMWYZyFwjI6PcYMjl7w8gfkcDrbavRKQhRauO2xaf/s32/sharethis.png") repeat scroll 0 0 transparent; }
/*]]>*/
</style>
<div id='btnt-social'>
<ul>
<li><a class='twitter' expr:href='"http://twitter.com/?status=" + data:post.title + " - " + data:post.url ' rel='nofollow' target='_blank' title='Share this post on twitter'/></li>
<li><a class='facebook' expr:href='"http://www.facebook.com/sharer.php?u=" + data:post.url + "&title=" + data:post.title' rel='nofollow' target='_blank' title='Share this post on Facebook'/></li>
<li><a class='stumbleupon' expr:href='" http://www.stumbleupon.com/submit?url=" + data:post.url + "&title=" + data:post.title' rel='nofollow' target='_blank' title='Share this post on Stunbleupon'/></li>
<li><a class='google-plus' expr:href='" http://plus.google.com/share?url=" + data:post.url + "&title=" + data:post.title' rel='nofollow' target='_blank' title='Share this post on Google+ '/></li>
<li><a class='pin-it-button' href='javascript:voidundefinedrun_pinmarkletundefined))'/>
<script src='http://assets.pinterest.com/js/pinit.js' type='text/javascript'/>
<script type='text/javascript'>
function run_pinmarkletundefined) {
var e=document.createElementundefined'script');
e.setAttributeundefined'type','text/javascript');
e.setAttributeundefined'charset','UTF-8');
e.setAttributeundefined'src','http://assets.pinterest.com/js/pinmarklet.js?r=' + Math.randomundefined)*99999999);
document.body.appendChildundefinede);
}
</script></li>
<li><div class='addthis_toolbox addthis_32x32_style'>
<a class='addthis_button_compact'/>
</div>
<script src='http://s7.addthis.com/js/300/addthis_widget.js' type='text/javascript'/></li>
</ul>
</div>
</b:if></b:if> - Now save your template And you can see your post page to check it.It Appears Only on Post Pages.
- If You Want to Display This Widget on Home Page Too. Then Simply Just Remove the following Code .
- <b:if cond='data:blog.pageType == "item"'>
<b:if cond='data:blog.pageType != "static_page"'>
</b:if></b:if>
0 comments:
Post a Comment