Tips Cara Buat Tombol Back to Top di Blog

ketika anda sedang membaca artikel yang panjang sekali.... nah kali ini saya akan memberikan langkah-langkah untuk membuat tombol back to top seperti di blog saya ini....tombol ini berfungsi untuk melompat ke atas.... dari pada menekan scroll bar di browser anda... lebih baik menekan tombol back to top... lebih cepat ....heheheheeee... ok saya akan memberikan langkah2nya.....

Langkah-langkah cara membuat tombol back to top :

1. login ke blogger.com
2. setelah pilih menu template dan pilh edit html...
3. selanjutnya tekan CTRL + F agar cepat mencari kode </head>...kemudian enter...
4. masukan kode di bawah ini, tepat di atas kode </head>, tapi jika suda ada kode ini... maka lewati langkah ini...  <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js'/> 
5. masih di tempat yang sama - </head>...
6. dan masukan script ini ---> <script type='text/javascript'>
   $(function() { $(window).scroll(function() {if($(this).scrollTop()&gt;500) { $(&#39;#ScrollToTop&#39;).fadeIn()}
   else { $(&#39;#ScrollToTop&#39;).fadeOut();}});$(&#39;#ScrollToTop&#39;).click(function(){$(&#39;html,body&#39;).animate({scrollTop:0},700);
   return false})});
   </script> seperti gambar di bawah ini....
   
   
   
7. setelah itu cari kode ]]></b:skin>....
8. dan copy kode css ini ---> #ScrollToTop{text-align:center;z-index:9999;position:fixed;bottom:40px; right:30px;cursor:pointer;display:none;opacity:0.7;}
   #ScrollToTop:hover{opacity:1;}  seperti gambar di bawah ini
   
9. setelah itu cari kode </body> dan copy kode ini ---> <div id='ScrollToTop'><img alt='Back to top' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhtAlHFDJz-brfD929Ewf12lFqHjoiVT4kNIcvW-tsMrG3RvuIEdMkwXDc6gTqLz_r9S9vj5QFmFaAEEGF6-568uhBo948PdKbEP6M07qHwxqemMbRl7HgksuidzQ3RShIGnkp0Zpx6nzc/s1600/backtotop.png'/></div> seperti gambar dibawah ini...
   

warna biru adalah link gambar dari back to top.... jika anda ingin menggantikan gambar back to top buatan anda sendiri silahkan.. tapi jangan lupa gambarnya harus diupload duluu :D eitsss.... ada yang lupa ..setelah itu tekan tombol simpan template... heheheheee ... jika ada yang ingin menambahkan silahkan komentar....

Semoga bermanfaat.....