Thursday, April 12

TechCrunch like Social Sharing Widgets for Blogger [ How to add Blogger Widgets ]

TechCrunch like Social Sharing Widget

Friends,we've so far shared many Blogger Widgets that let you increase your blog's exposure in popular social networking sites like Facebook, Twitter , Google + .

You may've seen Mashable like Social sharing widget, Twitter Bird Blogger Widget , Facebook Pop-up Widget ,here in this post we would like to share yet an another popular Tech Blog's Social Sharing widget for Blogger. Thanks to PBT for sharing this with us..
So many people searching for TechCrunch like Blogger Widgets and TechCrunch like Blogger Template . Although there is no Template available till now, let me try to share it to you soon , and for now i've shared TechCrunch like Social Sharing widgets for blogger blogs with all in one widget.
TechCrunch,widget,blogger,image,studentscrunch


How to add TechCrunch like Social Subscription widget to blogger ?

Follow the simple steps given below,

1. Goto Blogger > Design > Add Gadgets > HTML/JavaScript

2. Copy the below codes and paste in on the box 
<style type="text/css">
/* PBT- TechCrunch Widget Style Sheet */
.pbt-techcrunch{margin-bottom:10px;position:relative;width:300px; background-color:#fff ;margin-left: 10px;}
#pbt-social-widget-facebook{width:300px;overflow:hidden;margin-bottom:10px;margin-top:10px;border:1px solid gainsboro;}
#pbt-social-widget-facebook iframe{padding:15px 15px 0 15px;}#pbt-social-widget-facebook iframe{height:28px;width:300px;}
#pbt-social-widget-twitter{width:300px;overflow:hidden;margin-bottom:10px;border:1px solid gainsboro;}
#pbt-social-widget-twitter iframe{padding:19px 15px 19px 15px;}
#pbt-social-widget-google{width:300px;margin-bottom:10px;}#pbt-social-widget-chiclets{width:270px;overflow:hidden;text-align:center;padding:19px 15px 19px 15px;border:1px solid gainsboro;}#pbt-social-widget-chiclets div{width:32px;height:32px;display:inline-block;margin-right:10px;}
#pbt-social-widget-chiclets a{width:32px;height:32px;display:block;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiUgjX6HBYg5t-eVjigjvlEJEmlPxR6C3imSAnax0czxDZJd0kv7Ykl-4HRehMCVfZwD5W0n_-RuPF9Z3nA6KQ89K9LajSkyaCDhoO9-S6p2RivZZbaljy8iyTSKvaLQ-4lQaH-5yXdiDUi/s1600/social_widget_sprite.png) no-repeat;}#pbt-social-widget-chiclets-linkedin a{background-position:0 0;}
#pbt-social-widget-chiclets-stumbleupon a{background-position:0 -33px;}#pbt-social-widget-chiclets-youtube a{background-position:0 -65px;}#pbt-social-widget-chiclets-feedburner a{background-position:0 -97px;}#pbt-social-widget-chiclets-rss a{background-position:0 -129px;}
</style>
<div class="pbt-techcrunch" >
<div class="pbt-configuration">
<div id="pbt-social-widget-facebook">
<iframe src="//www.facebook.com/plugins/like.php?href=http%3A%2F%2Fwww.facebook.com%2Fprobloggingtools&amp;send=false&amp;layout=standard&amp;width=270&amp;show_faces=true&amp;action=like&amp;colorscheme=light&amp;font&amp;height=80" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:270px; height:80px;" allowtransparency="true"></iframe></div>
<div id="pbt-social-widget-twitter">
<a href="https://twitter.com/ProBloggingTool" class="twitter-follow-button" data-show-count="true" data-size="large">Follow @ProBloggingTool</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script></div>
<div id="pbt-social-widget-google">
<g:plus href="https://plus.google.com/104498101167197212267" size="smallbadge"></g:plus></div>
<div id="pbt-social-widget-chiclets">
<div id="pbt-social-widget-chiclets-linkedin"><a href="http://www.linkedin.com/today/probloggingtools/"></a></div>
<div id="pbt-social-widget-chiclets-stumbleupon"><a href="http://www.stumbleupon.com/channel/probloggintools/"></a></div>
<div id="pbt-social-widget-chiclets-youtube"><a href="http://www.youtube.com/probloggingtools"></a></div>
<div id="pbt-social-widget-chiclets-feedburner"><a href="http://feedburner.google.com/fb/a/mailverify?uri=Probloggingtools&loc=en_US"></a></div>
<div id="pbt-social-widget-chiclets-rss"><a href="http://feeds.feedburner.com/ProBloggingTools"></a></div>
</div></div></div>
3. Preview and Save it.

4. Now you've added TechCrunch.com like Social Sharing Widget on your blogger blog.
5. You have to Change the facebook fan page url , Feedburner URL , Youtube url , Stumbleupon, Google + page id to yours.

Share TechCrunch Blogger Widget to your friends 

If you like this Blogger Widget, dont mind sharing this on facebook,twitter as a thanks giving back to us.

You may also like : Mashable like Social Sharing Widget
                              Floating Social Sharing Buttons
More Blogger Widgets, Blogger Tutorials , Premium Blogger Tempaltes

No comments:

Post a Comment

Disqus for Students Crunch