Pada kali ini
saya akan membagikan tips bagaimana cara membuat status loading ketika memuat halaman blog. Jadi, bila sobat belum tahu dan masih bingung maksudnya
silahkan lihat gambar di bawah ini :
Status ini berguna bila sobat memiliki
blog yang berat atau sekedar membuat blog menjadi lebih dinamis. Langsung saja ke langkah –
langkahnya :
1.
Buka blogger.com lalu login.
2.
Pilih menu rancangan > Edit
HTML.
3.
Cari kode <body>
kemudian ganti dengan script dibawah ini :
<body onLoad='init()'><div id='loading''> <img border='0'
src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimqslYrTngy6rJA7T25-Z2dMMwiPD-IeQU2Oo8mwJSklZjG_4R_86yJLFoF2ZVSHD0ge2pZKs3zN505dUimksa0WXx6GRR-FUQw2OBf3uMQg6-FJJWfUY_3492c094PRv0GkRaPqr6s3WG/s1600/f2.gif'/></div> <script
src='http://farkryzer-script.googlecode.com/files/loading.js'
type='text/javascript' type='text/javascript'/>
Catatan: huruf yang saya warnai biru
adalah gambar loading dari statusnya, silahkan ganti sesuai dengan keinginan
sobat, dibawah ini beberapa macam gambar yang bisa sobat pilih (gambar
ringan tidak lebih dari 10kb dan rata-rata 5kb) :
4.
Langkah
terakhir simpan kode css ini di template sobat, jika bingung silahkan tempatkan
di atas kode ]]></b:skin> :
#loading{padding:
15px;border: 1px solid
#000;border-radius:3px;background-color:#f5f5f5;opacity:.8;filter:alpha;margin:auto;width:435px;text-align:center}
Catatan: yang saya warnai biru
bisa sobat ganti sesuai dengan keinginan
Catatan: script css diatas berguna untuk
mengatur tampilan dari status loading yang dipasang di blog sobat.
5.
Simpan dan
kemudian lihat hasilnya.
Catatan : ini hanya tambahan saja, tujuannya
untuk memasukan tulisan maupun link pada status loading jadi tida hanya kosong
dengan gambar loading saja.
Oke lihat dulu script di
bawah ini :
<body onLoad='init()'><div id='loading'> <p>Halaman
sedang dimuat</p><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimqslYrTngy6rJA7T25-Z2dMMwiPD-IeQU2Oo8mwJSklZjG_4R_86yJLFoF2ZVSHD0ge2pZKs3zN505dUimksa0WXx6GRR-FUQw2OBf3uMQg6-FJJWfUY_3492c094PRv0GkRaPqr6s3WG/s1600/f2.gif'/> <p>Bersabarlah, karena orang yang
sabar disayang tuhan</p>
<div style='text-align:right'><p>Mahadzikunuha Admin</p></div></div> <script
src='http://farkryzer-script.googlecode.com/files/loading.js'
type='text/javascript'/>
Bila sobat sudah pintar css
tentu saja cara ini lebih mudah diterapkan sendiri. Oke saya jelaskan satu
persatu.
Catatan: yang saya warnai kuning
tebal dengan <p> sampai </p> itu menandakan
kita akan menambahkan tulisan, masukan tulisan yang sobat inginkan antara
kode <p> dan </p> sehingga seperti contoh
ini :<p>Mahadzikunuha</p> untuk letaknya
tempatkan setelah <div id='loading'> dan </div>
Catatan: untuk menambah link gunakan kode HTML dengan
aturan <a href='alamat link'>nama link</a> letakkan setelah <p>. Contohnya : <p>Bersabarlah,
karena orang yang sabar disayang tuhan<a
href='http://mahadzikunuha.blogspot.com
'>Mahadzikunuha</a></p>
Lalu simpan dan lihat hasilnya.
0 komentar:
Posting Komentar