How to add button back top to your blog

In this post we are going to tell you friends How to add button back top to your blog By adding back and top buttons, we have many advantages This does not make it difficult to back and top the visitor to our blog And it can be very easy to page back and top we are telling you step by step how to add button back top to the blog. If you want to add it to your blog then follow the steps given below.


How to add button back top to your blog


Step 1: First log in to Blogger and then go to Themes -> Edit HTML.

Step 2: Now press the CTRL + F button to find <head> and add the code below to the <font> Font Awesome. back to top button.

<link href=’http://netdna.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.css’ rel=’stylesheet’/>
<script src=’https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js’></script>

Step 3: Again pressing CTRL + F button]]> Find </ b: skin> and]]> </ b: skin> First add the code below.

/******back to top button for blogger by lsvdpr.com**********/
.back-to-top { z-index:99999; position: fixed; bottom: 0.2em; right: 10px; background-color: transparent; font-size: 20px; padding: 0px 0px 0px 2px; display: none; border-radius: 30%; }
.back-to-top:hover { background-color: transparent; margin-bottom: 8px; font-size: 20px; }
.back-to-top i.fa.fa-arrow-up { color: #ff7211; padding: 4px 5px; border-radius: 50px; background-color: #222; font-size: 28px; border: 2px solid #fff; }
.back-to-top i.fa.fa-arrow-up:hover { color: #fff; padding: 4px 5px; border-radius: 50px; background-color: #222; font-size: 30px; border: 2px solid #ff7211; }

Step 4: Now press CTRL + F again and find </ body> and add the following code to </ body>.

<a class=’back-to-top’ href=’#’><i class=’fa fa-arrow-up’></i></a>
<script type=’text/javascript’>
jQuery(document).ready(function() {
    var offset = 220;
    var duration = 500;
    jQuery(window).scroll(function() {
        if (jQuery(this).scrollTop() > offset) {
            jQuery(‘.back-to-top’).fadeIn(duration);
        } else {
            jQuery(‘.back-to-top’).fadeOut(duration);
        }
    });
    jQuery(‘.back-to-top’).click(function(event) {
        event.preventDefault();
        jQuery(‘html, body’).animate({scrollTop: 0}, duration);
        return false;
    })
});
</script>

Step 5: Now finally save the template.

I hope you enjoyed this information and you have added the back top widget to your blog. Subscribe to our blog’s feedburner to read our blog’s latest updates directly in your email. If the post looks good, then share it on social media. this is very simple step in my post friends and you successfully how to add back to top at the button to your blog is now activate your back and top button very stylish new and help next and back.