Cara Mudah Membuat Efek Loading Di Blog

Selamat Siang agan-agan semua :)
Langsung aja cekidot....

Untuk membuat loading blog seperti itu
langsung aja disimak gan :
1. Masuk ke blogger
2. Pilih Template > Edit HTML (sebaiknya backup dlu template agan biar aman hehe)
3. Cari kode </head> dan letakkan kode jQuery ini tepat diatas kode </head> (gunakan Ctrl+F untuk memudahkan pencarian)

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

Note : Lewati cara ketiga apabila blog anda sudah terpasang jQuery !!!

4. Kemudian cari kode ]]></b:skin> dan letakkan kode dibawah ini tepat diatas kode ]]></b:skin>

#page-loader {
position:fixed !important;
position:absolute;
top:0;
right:0;
bottom:0;
left:0;
z-index:9999;
background:#000 url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxn1maggVxUidnQjh_X6ytTh_A6scE2nd7ZOhaDNH_jYgdaWoiY8s-RCYtjNrHmP7rOEuXntBGhHc2KWfzAHDBa4RZKOL3iM_QjfUCCNpI201xmJY-jbEmAxnfpmZjWgzYXU7o0ABP_3g/s1600/loadinfo.net+%284%29.gif') no-repeat 50% 50%;
color:white;
padding:1em 1.2em;
display:none;
}

5. Selanjutnya cari kode </body> dan letakkan kode dibawah ini tepat diatas kode </body>

<script type='text/javascript'>
//<![CDATA[
$(document.body).append('<div id="page-loader">Loading...</div>');
$(window).on("beforeunload", function() {
    $('#page-loader').fadeIn(1000).delay(6000).fadeOut(1000);
});
//]]>
</script> 

6. Simpan template dan lihat perubahannya.

Semoga Bermanfaat, Wassalam....

Agan Pengen Copas ? Tolong Sertakan Sumber, Hargai Karya Orang Lain !