Link

14
Cara Membuat Status Loading

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 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;
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";
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.

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.


  • Keterangan:
    Kode yang berwarna hijau adalah url dimana sobat menyimpan gambar animasi status loading-nya.
      
    Kode yang berwarna merah adalah url tempat sobat mengupload kode javascript animasi status loading-nya.

    Selamat mencoba!                                                                                                                                
       


    Label: , ,

    14 komentar:

    BeDa mengatakan...

    Dengan status loading pengunjung mendapatkan konfirmasi berapa lama lagi mereka harus menunggu. Lebih mendatangkan ketenangan/kepastian dalam menunggu

    Salam ukhuwah

    MF Writer mengatakan...

    aq wdh pnah pasang, pii blog kliatan tmbah berad :D

    Evo D mengatakan...

    sama persis ma Om-om.com.. tapi semuanya Mantab

    informasi jambi mengatakan...

    wah keren,, mantap banget makasih ya infonya,,
    salam sukses

    a-One jambi

    Rizkyzone mengatakan...

    saya juga pernah sob pasang trik ini d blog q tapi aq lepas lagi keeren sih sebenarnya, mangtab dah

    Rizkyzone mengatakan...

    link dah aq pasang silakan cek

    secangkir teh dan sekerat roti mengatakan...

    sejauh ini boleh dicoba :)

    KONEK Blog's mengatakan...

    aku belum pernag coba...di coba dulu ya...

    KONEK Blog's mengatakan...

    aku belum pernah coba...di coba dulu ya...

    Unknown mengatakan...

    dulu saya pernah coba, tapi gambarnya gk mau ilang

    Harry mengatakan...

    gan, kira-kira kalo pake status loading bikin berat blog kita ga nantiny?

    Harry mengatakan...

    gan, kira-kira kalo pake status loading bikin berat blog kita ga nantinya?

    Fadel mengatakan...

    Harrry| Lumayan

    luthfi117 mengatakan...

    hehehe...ane blum brani nyoba sob...takut berat...

    Posting Komentar

    Silahkan tinggalkan komentarnya...