Chronicl Thesis Skin’s Social Media Listing Widget

Would you like to have another different way of showing and sharing your social sites to your site visitors? Try out this social media widget from BlogTipsNTricks. Its design and appearance was based on the WordPress Chronicl Thesis skin. You can find the live demo here.
Read and follow the instructions below.

• In your Blogger dashboard’s “Design” section, go to “Layout”.
• Click on “Add a Gadget” and then choose “HTML/JavaScript”.
• Copy/paste the code below:

<div>
<ul>
<li><a href="http://feeds.feedburner.com/chandeepsBlogTips">Subscribe to the RSS Feed</a></li>
<li><a href="https://twitter.com/chandeeban">Follow me on Twitter</a></li>
<li><a href="https://www.facebook.com/blogtipsntricks">Find me on Facebook</a></li>
<li><a href="https://plus.google.com/u/0/b/101110372634917065358/">Join me on Google+</a></li>
<li><a href="http://in.linkedin.com/in/blogtipsntricks">Connect with me on LinkedIn</a></li>
<li><a href="http://www.youtube.com/user/chandeep10">Watch me on YouTube</a></li>
</ul>
</div>
<style type='text/css'>
/*<![CDATA[*/ 
.btnt-chronicl-social {  width: 320px;  margin: -10px;  }
.btnt-chronicl-social ul {  margin: 0;  padding: 0;  }
.btnt-chronicl-social ul li {  list-style:none;   padding: 0; text-transform: none; }
.btnt-chronicl-social ul li a {   color: #fff;   display:block;  }
.btnt-chronicl-social ul li a:hover {  color: #c9c9c9;  background-color: #333;   }
.btnt-chronicl-social ul li .rss { background: url("http://i1203.photobucket.com/albums/bb382/chandeep10/social-icons/RSS-1.png") no-repeat scroll 10px center #F87E12; background-size: 20px; padding: 17.5px 45px; }
.btnt-chronicl-social ul li .twitter { background: url("http://i1203.photobucket.com/albums/bb382/chandeep10/social-icons/Twitter.png") no-repeat scroll 10px center #4CACEE; background-size: 20px; padding: 17.5px 45px;}
.btnt-chronicl-social ul li .facebook { background: url("http://i1203.photobucket.com/albums/bb382/chandeep10/social-icons/Facebook-1.png") no-repeat scroll 10px center #3B5998; background-size: 20px; padding: 17.5px 45px; }
.btnt-chronicl-social ul li .google { background: url("http://i1203.photobucket.com/albums/bb382/chandeep10/social-icons/google.png") no-repeat scroll 10px center #D44937; background-size: 20px; padding: 17.5px 45px; }
.btnt-chronicl-social ul li .linkedin { background: url("http://i1203.photobucket.com/albums/bb382/chandeep10/social-icons/LinkedIn-1.png") no-repeat scroll 10px center #3692C3; background-size: 20px; padding: 17.5px 45px; }
.btnt-chronicl-social ul li .youtube { background: url("http://i1203.photobucket.com/albums/bb382/chandeep10/social-icons/Youtube-1.png") no-repeat scroll 10px center #C6312B; background-size: 20px;  padding: 17.5px 45px; }
/*]]>*/
</style>     

• Replace the highlighted portions with that of your own corresponding profile URLs
• Save the widget and you’re done!

Hope you enjoy your new social media widget.