Home » » Cara Membuat Tombol Back To Top Pure Javascript Di Blogger

Cara Membuat Tombol Back To Top Pure Javascript Di Blogger

Posted by Android Techpedia on Wednesday, July 17, 2019

Cara Membuat Tombol Back To Top Pure Javascript Di Blogger

Tombol Back To Top adalah sebuah tombol kecil yang sering kali terletak pada bagian kanan bawah pada tampilan suatu blog. Kegunaan dari tombol ini sangat sederhana, yaitu buat kembali ke tampilan atas halaman.

Dengan adanya tombol ini maka kamu tidak perlu lagi melakukan scroll keatas bila ingin melihat pulang laman awal blog.

Anda hanya perlu menekan tombol Back To Top yang telah kamu pasang sebelumnya, serta otomatis laman blog akan kembali ke tampilan atas blog.

Untuk cara pemasangan tombol ini sendiri juga sangat mudah, buat lebih jelasnya mengenai pemasangan tombol Back To Top ini silahkan ikuti caranya dibawah ini:

1. Langkah yang paling awal adalah beserta login ke blogger.com
2. Pada dashboard blogger, silahkan pilih Tema>Edit HTML
3. Cari kode </head> beserta memakai CTRL+F

4. Kemudian letakkan kode berikut, diatas kode </head> tadi
<style type='text/css'>/*<![CDATA[*//*Back To Top*/.scroll-buttonbox-sizing:border-box;font-size:1.2rem;line-height:2rem;padding:3px;width:38px;height:38px;right:20px;bottom:20px;visibility:visible;filter:alpha(opacity=50);filter:progid:DXImageTransform.microsoft.alpha(Opacity=50);opacity:0.5;cursor:pointer;transition:all 1.2s;-webkit-transition:all 1.2s;-moz-transition:all 1.2s;-ms-transition:all 1.2s;-o-transition:all 1.2s;background:none;border:solid 2px rgb(210,104,211);color:rgb(249,104,211);border-radius:0%;position:fixed.scroll-button:hoverfilter:alpha(opacity=100);filter:progid:DXImageTransform.microsoft.alpha(Opacity=100);opacity:1.scroll-button--hiddenfilter:alpha(opacity=0);filter:progd:DXImageTransform.microsoft.alpha(Opacity=0);opacity:0;visibility:hidden/*]]></style><script type='text/javascript'>//<![CDATA[function downloadJSAtOnload()var e=document.createElement("script");e.src="https://rawgit.com/mastamvan/backup/master/backtop.js",document.body.appendChild(e)window.addeventListener?Window.addeventListener("load",downloadJSAtOnload,!1):window.attachEvent?Window.attachEvent("onload",downloadJSAtOnload):window.onload=downloadJSAtOnload;//]]></script>

5. Simpan Tema serta selesai


Sangat mudah dan simpel bukan? Nah sekarang anda sanggup memanfaatkan tombol ini untuk menggunakan scroll ke halaman atas pada tampilan blog dengan sangat gampang.

Semoga cara ini dapat berguna untuk anda ya. Terimakasih dan sampai jumpa di pembahasan selanjutnya.


0 komentar:

Post a Comment

Popular Posts

Blog Archive

.comment-content a {display: none;}