Thêm Nút Back To Top Cho Blogspot sẽ làm cho việc trở lại đầu trang bài viết đơn giản hơn chỉ bằng 1 click! Thực hiện theo hướng dẫn này để tìm hiểu cách bạn có thể thêm chức năng này vào blog của mình bằng vài bước đơn giản:
Hướng Dẫn Thêm Nút Back To Top Cho Blogspot
Đầu tiền các bạn cần truy cập vào trang Blogger của mình – Ấn vào chủ đề – Chỉnh sửa HTM, sau đó làm theo các bước bên dưới đây.
Bước 1: Các bạn chèn đoạn css sau lên trên ]]></b:skin>
/* Back To Top */
.backtotop {
position: fixed;
bottom: 20px;
right: 20px;
cursor: pointer;
font-size: 25px;
box-shadow: 0 10px 15px -3px rgb(0 0 0 / 10%), 0 4px 6px -2px rgb(0 0 0 / 5%);
padding: 10px;
background-color: #138882;
opacity: .6;
color: #fff;
text-align: center;
width: 45px;
border-radius:5px;}
.backtotop:hover{opacity:1}
Bước 2: Thêm đoạn HTML và Js sau lên trên thể đóng </body>
<div class='backtotop'><i class='far fa-hand-point-up'/></div>
<script type='text/javascript'>
$(function(){$(window).scroll(function(){$(this).scrollTop()>100?$(".backtotop").fadeIn():$(".backtotop").fadeOut()}),$(".backtotop").click(function(){return $("html,body").animate({scrollTop:0},800),!1})});
</script>
Lưu template lại và xem kết quả nhé!
Lời kết
Như vậy là mình vừa hướng dẩn các bạn cách thêm nút Back to top cho blogspot khá đơn giản, hi vọng các bạn sẽ thích nó! Chúc Các Bạn Thành Công!
