Cara Menciptakan Tombol Back To Top - Kembali Ke Atas Responsive Fast Loading Di Blog

Cara Membuat Tombol Back to Top - Kembali ke Atas Responsive Fast Loading Di Blog-Fungsi Back to Top button ini memudahkan pengguna kembali ke halaman atas dalam satu klik atau satu sentuhan (tap).menu navigasi yang memudahkan pengunjung untuk kembali ke bab atas halaman blog secara cepat, tanpa perlu scroll mouse atau "usap-usap" screen.

Jika halaman discroll ke bawah, tombol Back to Top ini gres muncul. Begitu diklik, maka halaman yang sedang dibuka akan otomatis bergerak ke bab teratas.

Back to Top
ialah fitur atau widget yang "wajib" ada di blog Anda. Hal ini supaya memudahkan pengunjung dalam kembali ke bab atas halaman blog sesudah scroll ke bawah untuk membaca postingan.
Tombol Back to Top ini dapat dibilang ramah pengguna (User Friendly) alasannya ramah dalam pengguna dan memudahkan pengunjung yang membuka halaman atau postingan blog Anda. Untuk Contoh Bisa dilihat Di https://jalan-top.blogspot.com

 Kembali ke Atas Responsive Fast Loading Di Blog Cara Membuat Tombol Back to Top - Kembali ke Atas Responsive Fast Loading Di Blog
Baiklah Langsung saja menuju Cara Membuat Tombol Back to Top - Kembali ke Atas Responsive Fast Loading Di Blog

Langkah Pertama :
1. Buka Blogger - Kemudian Login / Masuk
2. Dashboard - Klik Template.

3. Silakan Edit HTML.
4.Temukan (CTRL+F) kode </body>

5. Copy&Paste arahan berikut ini, dan letakkan diatas arahan </body>
<!--Back To Top Ready Start--> <div class='back-to-top'><a href='#' id='back-to-top' title='back to top'> <i class='fa fa-chevron-up'/> </a></div> <script>           $(window).scroll(function() { if($(this).scrollTop() &gt; 200) { $(&#39;#back-to-top&#39;).fadeIn(); } else { $(&#39;#back-to-top&#39;).fadeOut(); } }); $(&#39;#back-to-top&#39;).hide().click(function() { $(&#39;html, body&#39;).animate({scrollTop:0}, 1000); return false; }); </script> <!--Back To Top End -->


6.Temukan kode ]]></b:skin> atau </style>
7. Copy&Paste arahan berikut ini, dan Letakkan diatas kode  ]]></b:skin> atau </style>
 #back-to-top{background:#E73037;color:#ffffff;padding:8px 10px;font-size:24px} .back-to-top{position:fixed!important;position:absolute;bottom:20px;right:20px;z-index:999}

8. Selanjutnya kita pasang Font Awesome.
Karena tombol kembali ke atas ini arah ke atas.
Temukan arahan
</head>
Copy&Paste arahan berikut ini, dan Letakkan diatas kode
</head>
<link href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet"></link>

9. Simpan Template.

Demikian Tutorial Blogger Cara Membuat Tombol Back to Top - Kembali ke Atas Responsive Fast Loading Di Blog kali ini, jikalau terjadi kesalahan / Masih Bingung silakan jangan sungkan untuk berkomentar dibawah ini. Sekarang anda Buka postingan yang mana saja dan srool e bawah dan apakah sudah muncul tombol back to top.

sekian semoga bermanfaat

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel