Ketika membuka sebuah blog di pencarian google search engine, pasti kalian pernah menemui animasi loading ketika mau menuju ke halaman dalam dari blog yang sedang kita tuju tersebut.
Animasi loading yang dimaksud bisa bermacam-macam bentuknya, ada yang berbentuk spinner, ada yang berbentuk tulisan dan ada juga animasi ikon loading. Jeda waktu pemuatan dengan tampilan blog sangat bagus dengan adanya loading tersebut.
Baca Juga : Efek Daun Berguguran dengan Kode Javascript
Maka tak ayal lagi, banyak blogger yang memasang animasi loading blog di blog yang mereka kelola. Selain menambah keindahan, para pengunjung blog akan disuguhi animasi unik sebelum membaca artikel di dalamnya.
Sungguh indah bukan bentuk animasi ini. Dan sekarang, malam ini saya akan memberi sedikit cara guna menampilkan animasi loading blog tersebut. Caranya bisa kalian simak dibawah ini ya :
Baca Juga : Efek Salju Berjatuhan di Halaman Beranda Blog
Berikut ini caranya
Animasi Loading Awal Blog Tampil
CSS
Kalian masuk ke Edit Template/Edit HTML disini kita akan mengutak-atik kode di dalam template. Harap back up dulu template kalian supaya nanti ketika ada error yang terjadi, template kalian masih aman.Temukan kode ]]></b:skin> dan tempelkan kode dibawah diatas persis kode ]]></b:skin>. Nyari dengan tekan Control + F bebarengan.
#alifaload {background:url(URL gif kalian taruh disini) no-repeat center;background-color:rgba(0,0,0,0.36);width:100%;height:100%;position:fixed;left:0;top:0;z-index:1000;}HTML
Cari kode </head>, tempelkan kode dibawah ini tepat dibawah kode </head>.<div id='alifaload'/>Javascript
Cari kode </body> dan tempelkan kode dibawah tepat diatas kode </body>.<script type='text/javascript'>
//<![CDATA[
// Loader
$(window).bind("load",function(){$("#alifaload").fadeOut(1e3)});
//]]>
</script>Catatan :
Untuk tulisan URL gif kalian taruh disini adalah URL gambar yang akan ditampilkan saat membuka blog
Nah bila sudah semua tinggal kalian save pekerjaan kalian dan publikasikan blog yang sudah diedit barusan. Terima kasih ya yang sudah mampir kesini dan membaca, serta mempraktekkan artikel Animasi Loading Awal Blog Tampil. Untuk animasi loadingnya bisa kalian lihat di Loading.IO. Terima kasih dan Salam.
