Cara Menciptakan Tombol Back To Top Widget

FAST DOWNLOADadsTombol Back To Top Widget - Memiliki banyak konten berarti banyak bergulir. Ini membantu untuk menciptakan sesuatu yang sedikit lebih gampang bagi pembaca Anda jikalau Anda termasuk cara gampang untuk melompat sepanjang perjalanan kembali ke atas halaman. Menambahkan Back To Top tombol sanggup dengan gampang memecahkan dilema bergulir dan benar-benar sederhana untuk menerapkan. Saya telah menyertakan benar-benar gampang Kembali ke tombol Atas sini untuk Anda bahwa Anda sanggup menambahkan ke website atau blog. Yang Anda butuhkan untuk mengedit ialah file CSS tema dan utama file HTML Template.

Berikut langkah - langkahnya :

1. Untuk awal menggunakannya masuk ke Template > Edit HTML
2. Pastikan di template blog Anda sudah ada instruksi jquery, yaitu instruksi menyerupai ini jikalau tidak ada letakkan instruksi dibawah ini sempurna diatas </head> dan copy salah satunya :

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

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

3. Klik "Layout" (Tata Letak)
4. Klik "Add Gadget" di Sidebar
5. Pilih "Javascript/HTML"
6. Copy dan Paste kode berikut ini:

 <style> .mbw-back-to-top {     position: fixed;     bottom: 2em;     right: 10px;     text-decoration: none;     padding: 1em;     display: none;     cursor:pointer; } </style> <img class="mbw-back-to-top" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgU0AeNK-7M9hErCDUY9Ev43kF-22yK2GpeS0ZuxtCTr4coc38SJVmn7TyEWRGBZZ0qUuKAHU9Uq1djRp7N4Etav8h-3_pNKIVKtwjMUl0tOj9y-pHqZhisZuhX8BoP8OcV_ely7OG04Es/s1600/back+to+top+button.png "/> <script type="text/javascript"> /*****mybloggersworld.com***/ jQuery(document).ready(function() {     var offset = 220;     var duration = 500;     jQuery(window).scroll(function() {         if (jQuery(this).scrollTop() > offset) {             jQuery('.mbw-back-to-top').fadeIn(duration);         } else { //www.mybloggersworld.com             jQuery('.mbw-back-to-top').fadeOut(duration);         }     });         jQuery('.mbw-back-to-top').click(function(event) {         event.preventDefault();         jQuery('html, body').animate({scrollTop: 0}, duration);         return false;     }) }); </script>  <style> .mbw-back-to-top {     position: fixed;     bottom: 2em;     right: 10px;     text-decoration: none;     padding: 1em;     display: none;     cursor:pointer; } </style> <img class="mbw-back-to-top" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgU0AeNK-7M9hErCDUY9Ev43kF-22yK2GpeS0ZuxtCTr4coc38SJVmn7TyEWRGBZZ0qUuKAHU9Uq1djRp7N4Etav8h-3_pNKIVKtwjMUl0tOj9y-pHqZhisZuhX8BoP8OcV_ely7OG04Es/s1600/back+to+top+button.png "/> <script type="text/javascript"> /*****mybloggersworld.com***/ jQuery(document).ready(function() {     var offset = 220;     var duration = 500;     jQuery(window).scroll(function() {         if (jQuery(this).scrollTop() > offset) {             jQuery('.mbw-back-to-top').fadeIn(duration);         } else { //www.mybloggersworld.com             jQuery('.mbw-back-to-top').fadeOut(duration);         }     });         jQuery('.mbw-back-to-top').click(function(event) {         event.preventDefault();         jQuery('html, body').animate({scrollTop: 0}, duration);         return false;     }) }); </script> 

Untuk warna merah anda sanggup mengganti linknya sesuai gambar yang anda inginkan. Simpan template Anda dan Anda harus melihat Kembali ke Atas Link muncul dikala Anda gulir ke bawah halaman. Demikian gosip perihal Cara Membuat Tombol Back To Top Widget. Maaf jikalau ada kekurangan, silahkan tambahkan beberapa kekurangan pada artikel di kolom komentar. Saya harap gosip ini bermanfaat.FAST DOWNLOADads| Server1 | Server2 | Server3 |