Cara pasang gambar status page loading di blogger. Jika mungkin, blog anda kurang impresif saat proses loading, kini anda dapat mengubahnya menjadi lebih menawan dengan menyisipkan status “Loading” pada blog Sobat. Animasi ini akan muncul saat blog kita sedang dalam proses loading.
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 anda 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.
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 anda 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.
Caranya ikuti langkah-langkah berikut,
Pertama, pilih saja dulu salah satu Animasi preloader dari dua layanan ini Preloader.net atau Ajaxload.info, Jika sudah, download hasil animasinya dan upload ke Hosting anda seperti Photobucket.com
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";
}
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";
}
Langkah kedua silahkan buka notepad , kemudian simpan kode di atas dengan nama preloader.js (pastikan ekstensi berakhiran JS , bukan TXT) dan setelah itu upload ke tempat penyimpan online atau jika mau lebih mudah upload saja di google sites.
Kemudian ikuti langkah berikut ini :
1. Silahkan login dulu ke Blogger.
2. Kemudian tuju halaman Edit HTML.
3. Klik Expand Template Widgets.
4. Cari kode <body> dan ganti kode tersebut dengan kode dibawah ini :
<body onLoad='init()'><div id='loading' style='position:fixed; _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'/>
5. Simpan Template.
Keterangan :
Kode yang berwarna merah adalah url dimana anda menyimpan gambar animasi status loading-nya.
Kode yang berwarna Biru adalah url tempat anda mengupload kode javascript animasi status loading-nya, kalau bingung atau susah -susah upload preloader.js di hosting kamu pake aja punya saya ini :
Keterangan :
Kode yang berwarna merah adalah url dimana anda menyimpan gambar animasi status loading-nya.
Kode yang berwarna Biru adalah url tempat anda mengupload kode javascript animasi status loading-nya, kalau bingung atau susah -susah upload preloader.js di hosting kamu pake aja punya saya ini :
http://rozein.googlecode.com/files/preloader.js
Jika anda malas untuk menyimpan gambar animasi status loading, saya punya beberapa gambar yang bisa anda gunakan dibawah ini :
Cara untuk mengcopy kode URL gambanya, arahkan korsor pada salah satu gambar, kemudian klik Kanan Pilih Copy Image Location.
Selamat mencoba...
Nama saya Yudi Aditya, Saya Bukan Seorang Blogger, Desainer atau Apapun Tapi Saya Hanya Seseorang Yang Ingin Selalu Belajar dan Ingin Tahu Sesuatu Yang Baru...
Postingan
0 komentar:
Posting Komentar