Membuat Efek Loading pada Blogger

Halo .. Kembali lagi bersama saya Faisal Rahman . Mungkin anda merasa kurang srek dengan template anda saat ini karena tampilanya yang biasa saja, dan mungkin anda berniat ingin menambahkan efek loading blog ketika halaman blog anda sedang loading.

Contohnya seperti di blog saya ,, pada saat masih loading tadi anda melihat halaman saya berubah menjadi biru dan muncul tulisan loading beserta animasi nya kan .. Seperti ini

Maaf ya sebelumnya ane update post ini , saya tidak lagi memakai loading ini .. Terimakasih :)

Jika anda ingin menambahkan seperti itu pada blog anda , ikuti langkah- langkah berikut ini :
1) Pertama Login ke blogger sobat

2) Buka Template lalu Copy dan paste kode berikut ini dibawah kode </head>

<style type='text/css'>
/* add loading image */
body {background:#136dad url(http://www.donateforchildren.org/loading.gif) no-repeat fixed center;}
/* hide page div */
#page{display:none;}
</style>
<script type='text/javascript'>
function css(classORid,rules){
try{var css=document.createElement("style");
css.innerHTML=classORid+"{"+rules+"}"
document.body.appendChild(css);}
catch(e){}
try{document.styleSheets[document.styleSheets.length-1].addRule(classORid,rules);}
catch(e){}}
function loaded(){
css("#page","display:block!important");
css("body","background:#ffffff url()");}
if(window.addEventListener)window.addEventListener("load",loaded,false);
else if(window.attachEvent)window.attachEvent("onload",loaded);
else if(document.getElementById)window.onload=loaded;
</script>

3. Cari <body> lalu pastekan <div id="page"> tepat dibawah <body>

4. Dan terakhir sebagai penutupnya silahkan anda cari </body> lalu pastekan </div> tepat diatas </body>

Kode Warna Hijau bisa diganti sesuka kalian (kode background)

Kode Warna Biru bisa diganti sesuka kalian (gambar gif Loading)

Semoga berhasil dan bermanfaat dengan tutorial ini . Salam blogger .. :)

Membuat Efek Loading pada Blogger

Related Posts

6 comments: