Tạo nút lên đầu trang (Scroll to Top) cho Blogger

Tạo nút lên đầu trang (Scroll to Top) cho Blogger | Scroll to Top góp phần cho blog thêm phần "chuyên nghiệp". Đó là một nút cuối chân trang cho phép bạn trở lên đầu trang một cách tiện lợi và nhanh chóng! Vậy nên, hôm nay mình sẽ hướng dẫn các bạn tạo nút lên đầu trang theo đúng ý của bạn!

Tạo nút lên đầu trang (Scroll to Top)

Trước hết các bạn Đăng nhập Blogger > Mẫu > Chỉnh sửa HTML.

Các bạn tìm đến thẻ </body>. Sau đó các bạn chọn một trong những mẫu Scroll to Top TẠI ĐÂY copy và dán ngay trước thẻ </body> đó.

Ví dụ 1 mẫu nhé!

<!-- scroll to top -->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" src="http://arrow.scrolltotop.com/arrow26.js"></script>

Lưu ý:
Nếu blog của bạn đã có hiệu ứng "jquery" thì bạn hãy xóa đoạn này đi nhé:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>

Đây chính là đoạn cần nhất:

 <script type="text/javascript" src="http://arrow.scrolltotop.com/arrow26.js"></script>

Nếu như bạn không muốn sử dụng JavaScript để cải thiện tốc độ trang thì bạn có thể sử dụng 1 trong 2 code sau:

Code 1: Như blog của mình, rất đơn giản không có hình ảnh.

<a href='#topbar'>Lên đầu trang &amp;uarr;</a>

Code 2:

<a href="#topbar" style="float: right;"><img alt="Lên Đầu" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjj6O-iB1IlyEGgMW1ZBTtbMXXUQX0Z90jz_VP6VOoOnTz2I1pszTB626jfNCicwGBMy60TwY1j0YzkUbBnowqCEDxRMQwiIE0U-vuSIiLAK64wbb6pQJtmB9Iv67C6mQa4TKazI57-uFD0/s1600/vers-haut-icone-5253-48.png" title="Lên Đầu Trang" /></a>

Thêm vào trước thẻ  </body>.

Lưu ý:
#topbar là id menu tức là đầu trang của bạn. Điều này phụ thuộc vào blog của bạn, xem đó là id nào? Để kiểm tra, các bạn vào trang blog của bạn, sau đó các bạn ấn chuột phải vào thanh Menu > Kiểm tra phần tử. Id của thanh menu đó sẽ hiện bên cửa sổ ở dưới.

Chọn Lưu mẫu và xem kết quả. Bài viết Tạo nút lên đầu trang (Scroll to Top) cho Blogger hi vọng sẽ hữu ích với các bạn.

Chúc các bạn thành công!

Share :

Tweet

✚

Related Post