Tutorial kita kali akan membahas cara membuat status loading, maksudnya adalah pada waktu sobat membuka halaman blog milik sobat, nantinya akan muncul sebuah image / gambar animasi loading yang atraktif sebelum blog tampil keseluruhan.
Pemasangan status loading ini akan mengubah sedikit kode HTML yang ada di template, jadi saya sarankan gunakan blog cadangan untuk mencoba tutorial ini, atau backup template sobat sebelum mengubah kode HTML-nya.
Karena kode yang di ubah adalah <body> dan saya tidak tau pasti apakah dengan mengubah kode tersebut akan melanggar TOS Blogger atau tidak. Makanya saya sarankan sebaiknya gunakan blog cadangan saja untuk mencoba membuat status loading ini. Baiklah, lanjut ya.
Untuk pilihan animasi status loading-nya bisa sobat lihat di Ajax Load.
Silahkan upload kode Javascript berikut ini ke tempat penyimpanan online. Pastikan file yang di upload berkhiran .js
var ld=(document.all);var ns4=document.layers;Cara upload file javascript-nya, copy paste semua kode diatas kedalam notepad, kemudian simpan file tersebut dengan extension atau akhiran .js dan setelah itu upload ke tempat penyimpan online atau jika mau lebih mudah upload saja di google sites.
var ns6=document.getElementById&&!document.all;
var ie4=document.all;
if (ns4)
ld=document.loading;
else if (ns6)
ld=document.getElementById("loading").style;
else if (ie4)
ld=document.all.loading.style;
function init()
{
if(ns4){ld.visibility="hidden";}
else if (ns6||ie4) ld.display="none";
}
Kemudian ikuti langkah berikut ini :
- Silahkan login dulu ke Blogger.
- Kemudian tuju halaman Edit HTML.
- Klik Expand Template Widgets.
- Cari kode <body> dan ganti kode tersebut dengan kode dibawah ini :
<body onLoad='init()'><div id='loading' style='position:absolute; width:100%; text-align:center; top:300px;'> <img border='0' src='http://tempat-simpan.com/gambarpreloader.gif'/></div> <script src='http://tempat-simpan/preloader.js' type='text/javascript'/> - Simpan Template.
Kode yang berwarna hijau adalah url dimana sobat menyimpan gambar animasi status loading-nya.
Jika sobat malas untuk menyimpan gambar animasi status loading, saya punya beberapa gambar yang bisa sobat gunakan dibawah ini :
 |  |
 |  |
 |  |
 |  |
 |  |
 |  |
 |  |
Selamat Mencoba !
|
Tweet
|
Berlangganan artikel terbaru via Email
|
10 comments
Wah nambah ilmu lagi neh, ada yang baruuu.... mo coba ah. Trims yaa dah berbagi ilmu.
wah udah lama gag posting nih kawan.infonya sangat berguna.tapi menurut saya ini tidak efektif karena hal ini biasanya kata para master akan mengganggu rawler google.nice info kok tapinya
TOP bgt mas..
berbagi ilmu nya yang bener2 luar biasa :)
tukeran link yuk mas..
link nya udah saya pasang di blog saya neh..
silahkan di cek
http://rahasia-masa-depan.blogspot.com
thx yah..
wow...bagus BOS...tapi didalam tag body aku udah ada triknya si lightbox...iihihihiih
Coba ya mas..keren
hahaha KOPI PASTE YA....script atas itu ada kesalahana,,ketahuan tukang kopasss
mas keren :D aku mau coba.. makasih yaa
kalau yg uda createproject gimana eek lah
nyari kata body dimana ?
saya pusingggg
mantap, ini yang saya butuhkan, untuk membuat pengunjung sedikit bersabar karena terdapat loading dari fungsi ajax ini, yang memungkinkan pengunjung mengerti bahwa apa yang dia klik sedang di proses..
makasi banyak ya mas tutorialnya.
Posting Komentar