Cara Membuat Tombol Back To Top Di Blogger

Cara Membuat Tombol Back To Top Di Blogger-Tau gak maksud dari judul diatas apa maksudnya? Mungkin Anda pernah berkunjung ke blog orang lain dan tidak sengaja ketika lagi baca artikel tiba-tiba muncul ikon panah ke atas biasanya berada di pojok bawah dan ketikan kita klik maka akan secara otomasis halaman kembali ke atas. Baca Juga: Cara daftar Dan Memasang DMCA Di Blogger

Jadi tau kan sekarang maksudnya, dengan menambah fitur ini maka pengunjung tidak akan kesulitan ketika membaca artikel dan sudah sampai bawah lalu ingin kembali ke atas tanpa harus menggulir mouse, hal ini sangat berguna apa lagi jika artikel yang ditulis cukup panjang.

Nah lalu bagaimana cara membuat tombol back to top pada platform blogger atau blogspot? Tenang seperti biasa saya akan berikan panduannya bagaimana cara membuat tombol back to top. Berikut adalah langkah-langkahnya:

Sebelum kita memulai pastikan pada blog Anda sudah terpasang kode jquery

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

Atau

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

Jika belum pasang terlebih dahulu dengan cara

1. Login ke akun blogger
2. pada halaman dashboard pilih Template lalu Edit HTML
3. Cari kode </head>, selanjutnya copy dan paste kode diaatas tadi tempat diatas kode </head>
4. Terakhir simpan

Selanjutnya kita pasang widget Back to Top di bloga, berikut adalah langkah-langkahnya:

• Pada halaman blog pilih Tata Letak
• Lanjut klik tambah gadget
• Pilih HTML JavaScript
• Copy dan paste kode dibawah ini pada kolom HTML JavaScript

<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/AVvXsEiRMrVQ2B68c3w-75M7Ab4tEz-wSv594DZrDKKohcAIrsq6ctOTfKGwCipuYH4MfrKF8c4kwrGsHhoVfSBPOd3iDpaWBbSKeEJlPVs6H_RXO4ZRKBGq0ROR9Wk4AkhUv03zuCE3pdqeaDY/s1600/back+to+top.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>

• Terakhir Simpan

Kode yang berwarna merah adalah gambar back to top, Anda dapat mengganti dengan gambar yang diinginkan atau dengan kode dibawah ini:

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhjLf0kbmLI7oefjDqjuL9WoLIvEpbrjSGJBQeWAy_dNJr16uWG0dWyoBBeQPWV99t9PPXpYvGdrZmuu1tXgAuCmuPRYVynKP8t5FFJcl23UR-S5hqIepJPzwRimZpoHdK4pbu_Kt6OGxo/s1600/back+to+top.png

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiygvx46Rdlbbcgsr9R5uxgLll7BLGEHf5r9XFNXNTsrYXfkj7sgDYJUIUJL5Co-FfhFvnpGEfOzJIRedckRpaqvj5BpWmr8HzOzGO0bNLw1l8m8qJ6VmTCgR5PlSdl5an7CUBPXOHfd-Q/s1600/back+to+top.png

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjAb-QGI6_XnvtL0ju7Cb7wbrCUEy5NHwva69eAupNNCDn0mc0izheMQUGQ2GlGjrDbWxYyJyxqi7168TdFMcEjz0OdYKYb3dmFtnZ3hZcfPGyGTE9KUVtb17EM7wWSvi0E8DDqx0-9Yn8/s1600/back+to+top.png

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh-OcFJPxNKeOXuJRDyFbI2EHAUNpHlHfB7kLikbebYAIpS1_p3pRYK5awMAAOYAACMnuzOngJ3Jmcy1BJoIx4KTWv26GVDaDSb19v0AUUDjGFSwIfkVPzQq8oy3iFz7Lkkb73gnqwqAiE/s1600/back+to+top.png

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhZNxuVGdS3fSK9Yh_Fw2LYs7xIQOWjZTwH04Q_nw25-kjn15iTml07J6eKD1VvPikQhEWC1LpelW3KjrUxxuRA4RG8sjFAvA2To-V0NNxdZ0YqLToCNGxFTPRF-IxfkuHCGWiCQxkyjI8/s1600/back+to+top+button.gif

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh2AW3nkTMZ7x6ifY8I-RRo3MI19JGotZcckqWTB_J9KzTHLFuahvX34e5bwKZrKuWZGFHcI4_LcvrS9EDuNVW7lHMre2Jvf0IncSIC0jHRLBuN_XHXBjNP_GNU49gbR_sR1D69_B2TcTw/s1600/back+to+top+button.png

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjXhPrBWw26SWLTzgAt837jL0bFhfnmtsaXpCgFnWcRHaTnhWKvZE8Uw_HTSUhJIsvcR5o7E-HFE7CQ4kZPOXyf-HNUPKwETi_MSbWp1ut0M2TCzVxIGjG_-z_8u6c6457ghU5grP-cCFk/s1600/back+to+top+button.gif 

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEijFMKbFJpIRkkmq2pO7_mMGUjRHRdxEj0ckqmmFqF4pS1UfHpv7ng-QbuJHW-DhFR2aPfIxAL65X4sbTGY4SD3d7w1D2ucWOBvQIBXivXP_EnoMnyxM8Cb1rHzKYj3fNZtONUOFqMmSDY/s1600/back+to+top+button.png

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiRMrVQ2B68c3w-75M7Ab4tEz-wSv594DZrDKKohcAIrsq6ctOTfKGwCipuYH4MfrKF8c4kwrGsHhoVfSBPOd3iDpaWBbSKeEJlPVs6H_RXO4ZRKBGq0ROR9Wk4AkhUv03zuCE3pdqeaDY/s1600/back+to+top.png 

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj_9eZhkrCJTC5ijPQUtzfyk6tspD__SafmHCaHhOMutSgHtMDcrtmcx-ANinU7V0VGqV8hwhuzstYfQzNE_j9rh8TfFnpHTF1zd2VBqe0cdel5P9x3VuBlt6Kn4buZRZ-jRI8qLlNii7I/s1600/Back-To-Top.png

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgcDmN1g8qrpdT3buVrBYNNEsBn9qwyxYVNIMCR7atW2KrH2GMpv2Bhhkg7zbkY3ajUz7fQEbbjDDefk0Luq-Ok7fOjeTQ7F3S3hIBdgUOpI8ValmXm7DvtzeEvAGJipxTKXFT6tlfMaT4/s1600/back-to-top-button.png

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjLPZ5Xua-GzR_yaZDtoz5dWo2wZv0w05bH_XbpOdt3sXvJRtp5RTcC8cLSBAjSx0jd7dQNy4rLTplGvPNWtdpvKdrlZVtp02RKu9f08j9N04jfHdKmWmbVB-O5GG3MJOXZsbLadeecwz0/s1600/back-to-top-button.png

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjqnxRdxCkuY0kxro8EHshJUFOmI1NlwLAtiP6LyOym4rFUVZpH4rk7cfSh2lV264ARlL5hg5xDtuGTHHIkUrL0iHZ3m9njyeGUWGWLioCaDUgEmTvovjL-Y9cEKqugFmvStv95VFaqftk/s1600/back-to-top-button.png

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgTyfvBx6qxn-57qFLspo113Y3j9Uw8l35vIXuPUScRGMautC12yJJ7OQY05cgMWUX-BJyWsDBTRCx2wUletRcWHtdz-WvRKdH4GHW2yY9a38vfuSMbYiZZ4ftaYllXq4YsvB932JctLtg/s1600/Back-To-Top.png

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjWQjqqH1_tQ2wGCgGgBcsm-ZUzPPlFWdsAa6K47p2HW2a7tSzHMh4e9ZtIMmRoMUJ7r2D7E946eUcfxCSY-Zl9B8aqDhkbH4G3aivRlR8nDiGmqsfzyDHsruaUOwW9OohxGkTFYIP9mE0/s1600/back_to_top_button.png

Itu dia Cara Membuat Tombol Back To Top Di Blogger, dengan memasang tombol back to top pada blog bukan hanya memberikan kenyamanan dan kemudahan pada pengunjung tapi bisa memberikan efek dan warna yang berbeda. Nah jika Anda ingin belajar blog silahkan kunjungi halaman Panduan Cara membuat Blogger dan Optimasi Seo

Artikel Terkait:

• Kumpulan Cheat PS2 Lengkap
• Kumpulan Cheat PS3 Lengkap
• Kumpulan Cheat PS4 Lengkap
• Kumpulan Cheat PC Lengkap
• Kumpulan Cheat PSP Lengkap
• Kumpulan Cheat XBOX Lengkap

Penting: Mohon maaf jika ada link mati atau gambar rusak, mohon untuk memberitahukan ke admin melalui email duputra3@gmail.com atau berkomentar, dengan begitu admin segera mengambil tindakan untuk memperbaikinya. Jangan lupa kunjungi juga toko kami