Home » , , , , » Nút Back to TOP button HTML cho Blogger (Blogspot), Wordpress, Joomla...

Nút Back to TOP button HTML cho Blogger (Blogspot), Wordpress, Joomla...

Written By Unknown on Monday, August 18, 2014 | 7:22 PM

Khi bạn xem nội dung của bài viết Website nào đó quá dài và bạn muốn lên đầu trang để xem những chuyên mục khác. Back to TOP button được hiểu là quay trở lên đầu trang sẽ giúp bạn làm điều đó với chỉ 1 thao tác nhấp chuột. Sử dụng Back top TOP button HTML hay back to TOP button Jquery cũng là điều đáng lưu ý vì nó cũng ảnh hưởng tới độ load của Website, blog. Ưu thế hơn là sử dụng button đó bằng HTML giúp cản thiện tốt hơn tốc độ load. Và bài viết này ITViet360 chia sẻ với bạn 16 Back to TOP button HTML cho Blogger (Blogspot), Wordpress, Joomla... và trên mọi nền source khác như: Xenforo, VBB, ASP.Net...vì đơn giản chỉ cần sử dụng 1 đoạn HTML.

Back to TOP button HTML For Blogger (Blogspot), Wordpress, Joomla...
Back to TOP button HTML cho Blogger (Blogspot), Wordpress, Joomla...

1. Làm thế nào để thêm Back to TOP button HTML cho Blogger (Blogspot), Wordpress, Joomla...


  • Đối với Blogspot:  Các bạn thêm bằng hai cách, 1 là dán code (ở bên dưới) vào trước thẻ đóng </body>, 2 là bằng 1 tiện ích (Widget) HTML/Javascript.
  • Đối với Wordpress, Joomla, Xenforo...các bạn làm tương tự

2. 16 mẫu Back to TOP button HTML

Back To Top Button #1
Demo tại Blog: Hình ảnh đẹp
<!--BACK TO TOP STARTS-->
<a rel="nofollow" style="display:scroll;position:fixed;bottom:10px;right:5px;" href="#" title="Back to Top"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhdBjqBYTgxX59mEzrNCpEIpLYMtOfcM9GbC_RPeTOhsqlenXJO77r8HPwOryaDNAmOrbDcGjJ8ba_TljmhHGs9SBRI_wseFKriLtOzj9ULgs6SACXvlHRy8Ff9r1A71OQ7J3Z09imalmI/s1600/back+to+top.png "/></a><!--www.ITViet360.com-->
<!--BACK TO ENDS-->

Back To Top Button #2
Back to TOP button HTML cho Blogger (Blogspot), Wordpress, Joomla...
Demo tại: Thanh niên Bình Định
<!--BACK TO TOP STARTS-->
<a rel="nofollow" style="display:scroll;position:fixed;bottom:10px;right:5px;" href="#" title="Back to Top"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj08PmH5GCroWS8Ih5hRMGr1v-fxsPcln2zp9TJXCWCkBEnSA7tGCUwZsJ6xdeACrhkxDM2_o6xDapL-wgu9d7WsE0qmp-5S-VLq1pywUbyvORob24bdO-sjdGc9WjtMrqdxWS1yZneSXQ/s1600/back+to+top+button.png "/></a><!--www.ITViet360.com-->
<!--BACK TO ENDS-->

Back To Top Button #3
Back to TOP button HTML cho Blogger (Blogspot), Wordpress, Joomla...
Demo tại ITViet360
<!--BACK TO TOP STARTS-->
<a rel="nofollow" style="display:scroll;position:fixed;bottom:10px;right:5px;" href="#" title="Back to Top"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjWywL-UzAsgxmxouGGtZ2InRRJBK5qVqlud49Xf_IETbU34hWKtZ0MyjuthtlgwREGXIXCWTFnp2wRyty4mP5sacK0brgk4VmMtCyzaE5HOqI4AkJOt8N-6LIb029rpCGjg5h9-_6pVIg/s1600/back-to-top-button.png "/></a><!--www.ITViet360.com-->
<!--BACK TO ENDS-->

Back To Top Button #4
Back to TOP button HTML For Blogger (Blogspot), Wordpress, Joomla...
<!--BACK TO TOP STARTS-->
<a rel="nofollow" style="display:scroll;position:fixed;bottom:10px;right:5px;" href="#" title="Back to Top"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgp2IxXO1s5FlTYcE8txwR8rddXK3Iojf7ZK42vxSfAXn-ogOW06WlOdToyFSOAHe6xOfgk-zoLZmuQF2oJannvyFDTSBFppPb6PgtldrlxVe-jKqvJEAak0ll_esJMACvRtM-qCNCzkc0/s1600/back+to+top.png "/></a><!--www.ITVie360.com-->
<!--BACK TO ENDS-->

Back To Top Button #5
Back to TOP button HTML For Blogger (Blogspot), Wordpress, Joomla...
<!--BACK TO TOP STARTS-->
<a rel="nofollow" style="display:scroll;position:fixed;bottom:10px;right:5px;" href="#" title="Back to Top"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiWwcxm3F7TL0FFMUxMOw8SZWd_iYrlOf1nR0Q4QVDmzgWd_iYPkC-PD6CMuFIQv7dF7cjAxmEuNdSQMT8ZQ0M_UMIRrfhuovBByKeFW0DW7CxY_BCQqG87qwjCy0bcS7a-I2HKSBdlCM4/s1600/back_to_top_button.png "/></a><!--www.itviet360.com-->
<!--BACK TO ENDS-->

Back To Top Button #6
Back to TOP button HTML For Blogger (Blogspot), Wordpress, Joomla...
<!--BACK TO TOP STARTS-->
<a rel="nofollow" style="display:scroll;position:fixed;bottom:10px;right:5px;" href="#" title="Back to Top"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgNfIqYeTS3ymr8V9B0AEVf0E4ES54qvIxWsuOzLL2qIk45w5vRuI-yzcgj2pgHQ9PxHQmPyBlXmq6SGfJQr2B16APY47vjKh0goRDr6u28HVP1p7hi0FmzOREl2iGHeO5eZfNVRBb02Pw/s1600/back-to-top-button.png "/></a><!-- www.itviet360.com-->
<!--BACK TO ENDS-->

Back To Top Button #7
Back to TOP button HTML For Blogger (Blogspot), Wordpress, Joomla...
<!--BACK TO TOP STARTS-->
<a rel="nofollow" style="display:scroll;position:fixed;bottom:10px;right:5px;" href="#" title="Back to Top"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh70B9o56hQC3HqN3TytAT3b5h58JTrwd_dajMicvN0H3nad_B9pcmMGZAwkjqUni84sv3elxzdYBWzW5qF64U-78paHNggcuxXGVw91v0zIZi64DsC0H6sAeUXjlovA2ODwc9U2TVea5Y/s1600/back+to+top.png "/></a><!-- www.itviet360.com-->
<!--BACK TO ENDS-->

Back To Top Button #8
Back to TOP button HTML For Blogger (Blogspot), Wordpress, Joomla...
<!--BACK TO TOP STARTS-->
<a rel="nofollow" style="display:scroll;position:fixed;bottom:10px;right:5px;" href="#" title="Back to Top"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgAT3heMCgDRGb7kX4JKhh8WMDjkGQX3zDtu0K55QTf1yuEgUAE3iTrsnJ_QP4bmhuAj2u7C9hhHCLh020OCayd738TF3q4ZzOHTIq54fyZGLcLjWuS2iuW9s8W5E2fyw840dhenfT5vZ0/s1600/back-to-top-button.png"/></a><!-- www.itviet360.com-->
<!--BACK TO ENDS-->

Back To Top Button #9
Back to TOP button HTML For Blogger (Blogspot), Wordpress, Joomla...
<!--BACK TO TOP STARTS-->
<a rel="nofollow" style="display:scroll;position:fixed;bottom:10px;right:5px;" href="#" title="Back to Top"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjwhArzG129DJ-BHLq3-CoBwJ3gzGUuykd1BPe6L_IargrbaPvrEu3R5WRt0xI6Vjthk89qDfOHw-cv66NZOrplTFTI1ooneOtADC07y7JGSaq8rylaccJMwxiOjWhxMtUctw46B3yoJt0/s1600/Back-To-Top.png"/></a><!-- www.itviet360.com-->
<!--BACK TO ENDS-->

Back To Top Button #10
Back to TOP button HTML For Blogger (Blogspot), Wordpress, Joomla...
<!--BACK TO TOP STARTS-->
<a rel="nofollow" style="display:scroll;position:fixed;bottom:10px;right:5px;" href="#" title="Back to Top"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLSrxujaLnAn-pi-FwRdYvGUxmxiCgiqJIB958NFH5ZwQHk-6SGfZKJk3n5gQ8ZX4kptOoLZXyGWYUH__Mm0ez09fnqtbXmxJOlg3oytB2dQsu_a2HPoZOeW1ZQ1eykICejROah44bTWw/s1600/back+to+top.png"/></a><!-- www.itviet360.com-->
<!--BACK TO ENDS-->

Back To Top Button #11
Back to TOP button HTML For Blogger (Blogspot), Wordpress, Joomla...
<!--BACK TO TOP STARTS-->
<a rel="nofollow" style="display:scroll;position:fixed;bottom:10px;right:5px;" href="#" title="Back to Top"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhOO6oyMkAJdWfUpNaI3qbAJssOLV4gDUFX6eUP5OxXZkcHgTs5A1rKvCblwpDQRmAXafOWor-cr8lsjAe9jcqRfwlYyXzxyiCUYC1EhG_sJaIurtXLEOvSytaw-YOizS4tBjiD6u870x4/s1600/back+to+top+button.png"/></a><!-- www.itviet360.com-->
<!--BACK TO ENDS-->

Back To Top Button #12
Back to TOP button HTML For Blogger (Blogspot), Wordpress, Joomla...
<!--BACK TO TOP STARTS-->
<a rel="nofollow" style="display:scroll;position:fixed;bottom:10px;right:5px;" href="#" title="Back to Top"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg4wqBrfbwb3X4CO5NYYnNljMma3P-BQtY49RTfI6IV40h2NO_-l1fC1CIdeyBVFePxApqYtP2GnxC3mrTFu7fBf8IUeuBOTR4fv3nBHlKTj0TSA-LsvW_jVaQwcw3_mGc3o6A2PXDLxl8/s1600/Back-to-top.png"/></a><!-- www.itviet360.com-->
<!--BACK TO ENDS-->

Back To Top Button #13
icon Back to TOP button
<!--BACK TO TOP STARTS-->
<a rel="nofollow" style="display:scroll;position:fixed;bottom:10px;right:5px;" href="#" title="Back to Top"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEihpw1NPKzxPO-DDru4sFKWTfPOhM6zaXq7dYJAQIBeh_bJMPpqWokCO1tUQeZAtzbyfiCw2I9bjHtLgEteM22DdJmJRKk0OHzjZaEFPAsydR_zQOTWboijg9QCGNZJxiHaK7ZmprAz_aA/s1600/back+to+top+button.gif"/></a><!-- www.itviet360.com-->
<!--BACK TO ENDS-->

Back To Top Button #14
icon Back to TOP button HTML For Blogger (Blogspot), Wordpress, Joomla...
<!--BACK TO TOP STARTS-->
<a rel="nofollow" style="display:scroll;position:fixed;bottom:10px;right:5px;" href="#" title="Back to Top"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiYMcmdlOA1qgHA3cmfAXPVcnNOT5dF9xfgisKFExrubjtA7wYapbs_eLagQbHubE8WkeGcPeV4p9LgvNPQhCyRstVYCy5YYMV1uoR2Fj1B5H6F1d7hFIGDiXSazDvhl3d150lAqwtkbCs/s1600/back+to+top.png"/></a><!-- www.itviet360.com-->
<!--BACK TO ENDS-->

Back To Top Button #15
Back to TOP button HTML For Blogger (Blogspot), Wordpress, Joomla...
<!--BACK TO TOP STARTS-->
<a rel="nofollow" style="display:scroll;position:fixed;bottom:10px;right:5px;" href="#" title="Back to Top"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEihVhLcaEPo3jOJfB_7VIicGXR_g0IDI7kJX2izXYjtR3aGLo_gFWUOwg91u_x5sUgq8WQpkyJKG9VJm-Z8lBC8ZEI9cGxO8xBkDTeSemiLnW_VJP_KkbsIMgho_Suy4S46MRnbExrSKSM/s1600/Back-To-Top.png"/></a><!-- www.itviet360.com-->
<!--BACK TO ENDS-->

Back To Top Button #16
Back to TOP button HTML For Blogger (Blogspot), Wordpress, Joomla...
<!--BACK TO TOP STARTS-->
<a rel="nofollow" style="display:scroll;position:fixed;bottom:10px;right:5px;" href="#" title="Back to Top"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEik-8eDbWfkWMYXhZ3CIxaHA0toMWPiRWYnJWySKNuQ-DYc1U1uNWEhBhfVqieQv2KjOqEF-_yt9qXSFLEY30eQ9ULw5yFAUJDGY7rkSlc4Xjtx5twS8yQu1OvjJrt4cMgTCqeOkAtrBTY/s1600/back+to+top+button.gif"/></a><!-- www.itviet360.com-->
<!--BACK TO ENDS-->

Hãy lựa chọn 1 Back to TOP button HTML theo phong cách của bạn nhé.
Chúc các bạn vui vẻ !

1 comments: