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.
Recommended for You:
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!
And that's it!
0 Comments