If You Have Knowledge, let others light Their candles At It. Margaret Fuller
To Know What You Know And What You Do Not Know, That is True Knowledge -Confucius

Thursday, 12 June 2014

Metro Style Social Media WIdget For Blogger


I am sharing another Social media Widget for blogger that would enhance the view and appearance of your blog. This will enable viewers/readers to socially interact with your webpages your Official Page of Facebook, Your twitter page, Google+ Page, Linkedin Profile.
Add This Widget Now, it looks incredibly beautiful.


Follow The Steps Below :

1. Go To Your Blog.
2. Click on Layout.
3. Click on Add a Gadget
4. Click on HTML/Javascript
5. Paste The Code Below And Done
6. Change Details to your Official Web page links.
6. Enjoy

<style>
.metro-social{width:315px}
.metro-social li{position:relative;cursor:pointer;padding:0;list-style:none}
.metro-social .facebookbt,.twitterbt,.googleplusbt,.pinterestbt,.linkedinbt,.youtubebt,.rssbt{z-index:7;float:left;margin:1px;position:relative;display:block}
.metro-social .facebookbt{background:url(http://technoratan.in/wp-content/uploads/2014/04/bt-facebook.png) no-repeat center center #1f69b3;width:140px;height:141px}
.metro-social .twitterbt{background:url(http://technoratan.in/wp-content/uploads/2014/04/bt-twitter.png) no-repeat center center #43b3e5;width:68px;height:70px}
.metro-social .googleplusbt{background:url(http://technoratan.in/wp-content/uploads/2014/04/bt-google+plus.png) no-repeat center center #da4a38;width:69px;height:70px}
.metro-social .pinterestbt{background:url(http://technoratan.in/wp-content/uploads/2014/04/bt-pinterest.png) no-repeat center center #d73532;width:68px;height:69px}
.metro-social .linkedinbt{background:url(http://technoratan.in/wp-content/uploads/2014/04/bt-linkedin.png) no-repeat center center #0097bd;width:69px;height:69px}
.metro-social .youtubebt{background:url(http://technoratan.in/wp-content/uploads/2014/04/bt-youtube.png) no-repeat center center #e64a41;width:140px;height:69px}
.metro-social .rssbt{background:url(http://technoratan.in/wp-content/uploads/2014/04/bt-feed.png) no-repeat center center #e9a01c;width:140px;height:69px}
.metro-social li:hover .facebookbt{background:url(http://technoratan.in/wp-content/uploads/2014/04/bt-facebook1.png) no-repeat center center #1f69b3}
.metro-social li:hover .twitterbt{background:url(http://technoratan.in/wp-content/uploads/2014/04/bt-twitter1.png) no-repeat center center #43b3e5}
.metro-social li:hover .googleplusbt{background:url(http://technoratan.in/wp-content/uploads/2014/04/bt-google+plus1.png) no-repeat center center #da4a38}
.metro-social li:hover .pinterestbt{background:url(http://technoratan.in/wp-content/uploads/2014/04/bt-pinterest1.png) no-repeat center center #d73532}
.metro-social li:hover .linkedinbt{background:url(http://technoratan.in/wp-content/uploads/2014/04/bt-linkedin1.png) no-repeat center center #0097bd}
.metro-social li:hover .youtubebt{background:url(http://technoratan.in/wp-content/uploads/2014/04/bt-youtube1.png) no-repeat center center #e64a41}
.metro-social li:hover .rssbt{background:url(http://technoratan.in/wp-content/uploads/2014/04/bt-feed1.png) no-repeat center center #e9a01c}
</style>

<div class="metro-social">
<br />
<li><a class="facebookbt" href="http://www.facebook.com/infoneed2explore"></a></li>
<li><a class="twitterbt" href="http://twitter.com/nitish460"></a></li>
<li><a class="googleplusbt" href="https://plus.google.com/+NitishKumar01"></a></li>
<li><a class="pinterestbt" href="http://www.pinterest.com/Nitishcool01"></a></li>
<li><a class="linkedinbt" href="https://www.linkedin.com/profile/view?id=345096216"></a></li>
<li><a class="youtubebt" href="http://www.youtube.com/user/nitish419"></a></li>
<li><a class="rssbt" href="http://feeds.feedburner.com/need2explore"></a></li>

</div> <center></center>



Floating Vertical Bar With Share Buttons widget by techiterian

No comments:

Post a Comment

Designed By Seo Blogger Templates