under development....
exchange link with us!!


random rotating header image on blogger

Memang, jikalau berbicara masalah blogger hack atau blogger tutorial tiada akan ada habisnya. Selalu ada saja yang baru. Ya sudah lah, sekarang yang penting, blogger tutorial seperti apa yang akan saya sharing kali ini. penasaran bukan?

Sesuai dengan judul postingan ini(supaya lebih keren dikit, pakai bahasa inggris...padahal kaga pinter bahasa ingris(^_^) ), dalam blogger tutorial kali ini saya ingin sharing bagaimana membuat gambar header blogger kita bisa gonta ganti sesuai dengan banyaknya gambar yang sudah kita persiapkan. Untuk demo, silahkan kunjungi wedding planningblog disini!!.lalu, refresh browser anda (atau reload ulang lah..gitu loh). Maka, anda akan melihat gambar header dari blog wedding planningtersebut berganti-ganti setiap anda merefresh/mereload ulang browser anda.

Sudah tidak sabar untuk membuatnya?mari kita mulai:

  • Pertama, ngopi dulu biar tidak pusing siapkan gambar anda.bisa 5, 6, 7 atau berapapun (semakin banyak tentunya header blog anda akan semakin ramai, bukan?). Yang harus di perhatikan, ukuran gambarnya harus sesuai dengan gambar header blog anda sebelumnya atau sama dengan ukuran header wrapper blog anda.
  • Kedua, sudah basi...... login keblogger saudara »»layout (tata letak)»»edit html.
  • Copy kode di bawah ini dan letakkan di dalam kode <body>.........</body> template blog anda. Atau gampangya, letakkan tepat di bawah kode <body>,
    <script type="text/javascript"> var banner= new Array() banner[0]="http://static.flickr.com/84/269053449_acad87a793_o.jpg" banner[1]="http://static.flickr.com/95/269053438_4ef5a3983e_o.jpg" banner[2]="http://static.flickr.com/96/269053404_44a3b0eda8_o.jpg" banner[3]="http://static.flickr.com/108/269053262_608edbdda4_o.jpg" banner[4]="http://static.flickr.com/98/269053232_6f7c6f994a_o.jpg" var random=Math.round(4*Math.random()); document.write("<style>"); document.write("#header {"); document.write(' background:url("' + banner[random] + '") no-repeat left TOP;'); document.write(" }"); document.write("</style>"); </script>
  • Yang harus di perhatikan hanyalah kode-kode yang saya beri warna hijau dan merah. Kode yang hijau, ganti url gambar dengan url penyimpanan gambar-gambar image header blog sampeyan. bisa ditambah atau dikurangi. sesuaikan saja. Untuk kode Math.round(4*Math.random()); , apabila gambar anda berjumlah 6, maka ganti angka 4*Math dengan 5, bila gambar anda berjumlah 3, maka ganti angka dengan 2. dan seterusnya.

Saya rasa cukup mudah bukan? dan cukup sekian blogger tutorial / blogger hack kali ini, sedikit tambahan, cara kerja dari sricpt kode diatas adalah menutupi header image blogger anda yang berada di dalam variable #header di bagian style dengan image-image yang di tentutukan, jadi usakan untuk membuat image yang sama ukurannya dengan image header asli blog anda..Kalau anda tidak berhasil, tinggal kirim pertanyaan saja melalui kotak komentar, sebisa mungkin akan saya bantu.Saya tidak jelaskan terlalu banyak kali ini karn ahari ini saya lagi malas untuk nulis banyak-banyak, capek tau!!!

Bila ingin melihat demo dari tutorial ini (dan berhasil seratus persen) silahkan kunjungi wedding planning blog.

selamat mencoba.

Tutorial Yg Masih Berhubungan



9 komentar:

Yusuf AlAzhar mengatakan... Pada: 22 Juni 2008 pukul 00.48  

anda menulis sesuatu yang sangat berguna bagi banyak orang....(^_^)

LDK AMAL mengatakan... Pada: 12 Agustus 2008 pukul 07.15  

thanks mas, tips-tipsnya membantu sekali. semoga anda mendapatkan pahala tuk mendapatkan ridho Allah Swt. atas artikel ini. waslm

mas Aan mengatakan... Pada: 16 Agustus 2008 pukul 07.39  

SAMA SAMA, TAPI MAAF, UNTUK 2 BULAN INI SAYA BELUM BISA UPDATE TULISAN-TULISAN SAYA (TERUTAMA BLOG INI ) KARNA SAYA MASIH ADA KENDALA, atm saya hilang dan masih beserta surat-surat berharga, jadi masih on proges sampai semua selesai baru bisa ngenet lagi.(insyaallah ramadhan dah bisa online lagi)

salam.
luqman
blog owner

Wahidin Agus Priyono mengatakan... Pada: 21 Agustus 2008 pukul 02.56  

hmmm... baru belajar mas, boleh boleh boleh... nanti saya kemari lagi

mas Aan mengatakan... Pada: 28 Agustus 2008 pukul 04.27  

informasi kepada rekan-rekan pengunjung blog ini, awal ramadhan ini insyaallah blog ini sudah bisa berjalan seperti biasa.

terimakasih.
Aan

Anonimmengatakan... Pada: 14 Desember 2008 pukul 05.34  

thanks infonya
bookmark dulu

mas Aan mengatakan... Pada: 18 Desember 2008 pukul 02.04  

#casual cutie:
thanks ya atas kunjungannya.denga senang hati silahkan bookmark halaman ini.. he

Abi mengatakan... Pada: 9 Februari 2009 pukul 07.31  

hai bagus banget blognya

koreabanget mengatakan... Pada: 20 Desember 2009 pukul 22.45  

makasih infonya! ini yang saya cari2 selama ini!
:)

Posting Komentar

ANDA KOMENTAR, SAYAPUN KOMENTAR DI BLOG SAUDARA