Menambahkan Tombol Back To Top pada Jekyll
Posted on
Untuk memudahkan scroll ke paling atas pada artikel yang panjang, aku butuh satu tombol back to top. Tadinya mau bikin pakai cara manual, tapi aku urungkan karena ketemu repo vanilla-back-to-top. Berikut ini deskripsinya: Simple and tiny Back To Top button with no dependencies. Hides when on top, scrolls up smoothly when clicked. Works equally great with Vue, React, Angular and without frameworks on Jekyll, Hugo and Hexo. Keren!
Akhirnya aku coba dengan cara edit _layouts/default.html, kemudian sebelum tag </body> aku tambahkan:
<script src="https://unpkg.com/[email protected]/dist/vanilla-back-to-top.min.js"></script>
<script>addBackToTop({
diameter: 40,
backgroundColor: 'rgb(255, 82, 82)',
textColor: '#fff'
})</script>
Tes pakai bundle exec jekyll serve hasilnya memuaskan, akhirnya saya push ke repo produksi.