Add a Social Media Subscription Widget to Blogger

Social Media plays an important role in building a successful blog. It helps us to easily interact with our visitors/readers and also drives massive traffic to our blog. Read my previous article on 8 Effective Ways to Generate Massive Traffic from Facebook. I'm telling you with my personal experience that having a social media subscription widget in the sidebar of a blog can help you to increase your subscribers and followers. The more subscribers you have, the more traffic you'll receive because your subscribers will get notified about your new posts and they'll definitely visit your blog to check what's new. We have shared a lot of Social Media subscription widgets and today we're going to share another simple and professional looking social media widget for blogger.
Add a Social Media Subscription Widget to Blogger
Recommended for You:

Add a Social Media Subscription Widget to Blogger

First and foremost, log in to your Blogger Account >> Select a Blog >> Layout >> Add a Gadget, scroll down and select HTML/JavaScript gadget from the list of gadgets. Now Copy the following piece of code and paste it in the empty widget box.

<style type="text/css">
.bgt-social { width: 290px; }
.bgt-social ul { border: 1px solid #CCCCCC; margin: 0; padding: 0; }
.bgt-social ul li { list-style:none; padding: 0; text-transform: none; border-bottom: 1px solid #CCCCCC; border-top: 1px solid #FFFFFF; }
.bgt-social ul li:first-child { border-top: 0 none; }
.bgt-social ul li:last-child { border-bottom: 0 none; }
.bgt-social ul li a { background-color: #F2F2F2 !important; color: #404040; display:block; }
.bgt-social ul li a:hover { background-color: #949494 !important;color: #0d0354; }
.bgt-social ul li .rss { background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhrNn0_HMWAxHerTKDZT-yFkwjWEGHcC6_8CDlqJOyKFeG3ZepcX-6DXRxdpGbdyW_xkJY5zgOMLM4oC5LZPHshwpKmPo1JC1wQZ_khhfEQKOxLZtLNiEZ4flKdNfdtBUDdsIv-W4RW3AA/s1600/bt-RSS.png") no-repeat scroll 10px center #F87E12; padding: 17.5px 60px; }
.bgt-social ul li .twitter { background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhqpg38pKeCdlPQ7jInxcH4Znym6GUgHdY60TSrGAC0XhL0IylMAD3CbAUV8jIWD4KmE-1zeLbS6pPO3c06jGM_KM6q5zPByvdizLVcpQiZDaS5evIeJ9QB1j1Xdg7WPQNKBeNy9y-R9IM/s1600/bt-Twitter.png") no-repeat scroll 10px center #4CACEE; padding: 17.5px 60px;}
.bgt-social ul li .facebook { background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhgycvi4Yvt8dqIodIHz7EeG-iNeYnXAFuJ4Clzu4pC-V4etXVWLcPtIsPWxnK5vwYE1o8Ef5A8CLWdsDyKivbpXh4Mf43x_uFWt-QbX197ULp4JZkyXmgx3QDbwe98DjeN3wBdad64Dwg/s1600/bt-Facebook.png") no-repeat scroll 10px center #3B5998; padding: 17.5px 60px; }
.bgt-social ul li .google { background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjOSjXOKMtyF7TBj0hRE6RFwb7r0Nu1GTzSb38z-S5WjPBBW5ulzpUjAnNImmAV2-I642SCWPJv1xvsbJv2zCQOWaax5XFEBdDaoeOXlpX5ugqgeEejRBGOtonM_a12NSWJyGGO8YStC8Y/s1600/bt-google.png") no-repeat scroll 10px center #D44937; padding: 17.5px 60px; }
.bgt-social ul li .linkedin { background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiTVj0e-Ywi6oeHhCHBi3Xm8ADqjTc6cnp1xop6g4u2st4gb9URj-rqxWwxijZJeB3XK5eIb5mHGw2nRCx5_RI_t6ESQaQqID92EQI3MdpkmeGYu1rSE78Fgjl1Wd86gyNmFuP5ZbGwYsQ/s1600/bt-LinkedIn.png") no-repeat scroll 10px center #3692C3; padding: 17.5px 60px; }
.bgt-social ul li .youtube { background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjNmuc6_iukfNPHiK3KEpU4q44btMIlRupD14sjpQvGGZoKvVDdL1jA_-i6gmUsE_FvguFX_usCmSyya-O4NdvEgz94hOHweWVaGO5hqryqPILElhyv8IIIgBqB03gnMXClf_r0Yi4Mx6w/s1600/bt-Youtube.png") no-repeat scroll 10px center #C6312B; padding: 17.5px 60px; }
.social-about { display: none; }
</style>
<div class="bgt-social">
<ul>
<li><a class="rss" href="http://feeds.feedburner.com/blogolect">Subscribe to RSS</a></li>
<li><a class="twitter" href="https://twitter.com/blogolect">Follow me on Twitter</a></li>
<li><a class="facebook" href="https://www.facebook.com/blogolect.official">Find me on Facebook</a></li>
<li><a class="google" href="https://plus.google.com/+zohaibliaqat" rel="author">Join me on Google+</a></li>
<li><a class="linkedin" href="http://linkedin.com/USERNAME">Connect on LinkedIn</a></li>
<li><a class="youtube" href="http://www.youtube.com/USERNAME">Watch me on YouTube</a></li>
</ul>
</div>

  • Replace the text in green with your Usernames

Click Save button
And that's it!

From Editors Desk

We hope this article may have helped you in learning How to Add a Social Media Subscription Widget to Blogger. Share this article with your friends and don't forget to subscribe us.

Post a Comment

0 Comments