Saturday, September 02, 2017

How to Add Follow Buttons to Your Blog

This is no new trick and theres no need for long story in getting this done as it is just some click away from getting this done. Basically what follow buttons do is that they link your readers to your social media pages in which you get to have more likes on your social media pages more subscribers to your channel . So to add this follow buttons to your blog you need to go.The reason for adding this post is that, recently i noticed people makes use of adblockers more often which wouldn't make the share buttons appear. So on this post i would be sharing the script you can make use to add share buttons to your blog which wouldn't be blocked even when the user makes use of adblocker.

Steps to add follow buttons to your blog.

»Firstly, log to your blogger dashboard  and locate Layout on your dashboard.

Add follow buttons to blog_Naijabrainies

»Decide wherever you want the buttons to be placed on your blog and click on add gadget then select  HTML/JAVA. and click on the +button.

»Then paste all the codes below in the box provided. 

<link href='//' rel='stylesheet'/>
.gvusion-socials-icons{margin:0 0 20px 0}
.gvusion-socials-icons ul{margin:0;padding:0;list-style:none;margin-bottom:-5px;margin-right:-5px;overflow:hidden}
.gvusion-socials-icons ul li:before{display:none}
.gvusion-socials-icons ul li{margin:0;padding:0;list-style:none;float:left;width:45px;height:45px;line-height:45px;text-align:center;background:#00baff;font-size:21px;margin-right:5px;margin-bottom:5px;opacity:.9;border-radius:3px;}
.gvusion-socials-icons ul li:hover{opacity:1;}
.secondary-sidebar .gvusion-socials-icons ul li{width:36px;height:36px}
.secondary-sidebar .gvusion-socials-icons ul li a{line-height:45px}
.secondary-sidebar .gvusion-socials-icons ul li a i{font-size:20px}
.gvusion-socials-icons ul li a{line-height:45px;display:block;color:#fff}
.gvusion-socials-icons ul li a:hover{color:#fff}
.gvusion-socials-icons ul li.home{background:#83868a}
.gvusion-socials-icons ul li.facebook{background:#516ca4}
.gvusion-socials-icons ul li.googleplus{background:#f20000}
.gvusion-socials-icons ul li.rss{background:#f29400}
.gvusion-socials-icons ul{background:#f20000}
.gvusion-socials-icons ul li.dribbble{background:#dc71a6}
.gvusion-socials-icons ul li.deviantart{background:#4c5e51}
.gvusion-socials-icons ul li.pinterest{background:#f20000}
.gvusion-socials-icons ul li.instgram{background:#406f94}
.gvusion-socials-icons ul li.tumblr{background:#395875}
.gvusion-socials-icons ul li.linkedin{background:#1985bc}
.gvusion-socials-icons ul li.soundcloud{background:#f60}
<div class="gvusion-socials-icons mom-socials-widget">
<li class="facebook"><a href="" rel="dofollow" target="_blank" title="Follow us on Facebook"><i class="fa fa-facebook"></i></a></li>
<li class="twitter"><a href="" rel="dofollow" target="_blank" title="Follow us on Twitter"><i class="fa fa-twitter"></i></a></li>
<li class="googleplus"><a href="" rel="dofollow" target="_blank" title="Follow us on Google+"><i class="fa fa-google-plus"></i></a></li>
<li class="instagram"><a href="" rel="dofollow" target="_blank" title="Follow us on instagram"><i class="fa fa-instagram "></i></a></li>
<li class="youtube"><a href="" rel="dofollow" target="_blank" title="Follow us on Youtube"><i class="fa fa-youtube "></i></a></li>
<li class="pinterest"><a href="" rel="dofollow" target="_blank" title="Follow us on Pinterest"><i class="fa fa-pinterest "></i></a></li>
Read also:How to add Flying Twitter Bird to Blogger

Save and reload your blog to see the new change on your blog.

Are you having any issue with any of our post or you have suggestions? please feel free to drop your comment. Be social, Tell us what you think.