Halo Semuanya, Kali ini Saya akan membagikan Tutorial Cara Menambahkan Page Loader Progress Bar Di Blogger, Kali ini kita akan membuatnya dengan Library pace.js sehingga kita dapat Menambahkannya dengan sangat Mudah.
Tidak perlu berlama lama, Ayo lanjut ke Tutorialnya.
Menambahkan Beberapa Kode ke Template
Untuk membuat Loadernya, kita akan menambahkan beberapa Baris Kode CSS dan Kode Javascript Eksternal ke dalam Template. Berikut adalah Caranya.
1. Buka Dashboard Blogger
2. Pada Dashboard Blogger, Klik Tema.
3. Kemudian Klik Dan Klik Edit HTML.
4. Cari Bagian /*]]>*/</style> atau ]]></b:skin> dan Tempel Kode Berikut Tepat Diatasnya.
/* Pace v1.2.4 - Default theme | Licensed MIT © HubSpot, Inc. | github.com/CodeByZach/pace */ .pace{-webkit-pointer-events:none;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.pace-inactive{display:none}.pace .pace-progress{background:#ffa900;position:fixed;z-index:2000;top:0;right:100%;width:100%;height:2px}
Ganti bagian yang Ditandai yaitu #ffa900 menjadi Kode warna Loader yang Anda inginkan.
5. Lalu taruh Kode berikut tepat Diatas Tag </head>.
<script src='https://cdn.jsdelivr.net/npm/pace-js@latest/pace.min.js'/>
6. Lalu Anda dapat Menyimpan Perubahan yang telah Anda Lakukan Pada Template Blogger Anda dengan mengeklik Tombol Simpan, dan Selesai.
Anda dapat melihat Contoh (Demo) nya di Blog ini, Cukup Muat ulang Halaman Blog ini dan lihat pada bagian atas Halaman.
Penutup
Jadi ini Adalah Cara Menambahkan Page Loader Progress Bar Di Blogger. Saya harap Artikel ini dapat membantu anda, Jika ada yang ingin ditanyakan maka tanyakan Di Kolom Komentar.