Ada beragam teknik untuk mengubah background pada template tiap melakukan reload (F5) atau tiap pindah halaman, baik itu dengan permainan php maupun javascript. Rotasi Background tiap Reload atau bahasa lainnya "Random Background Rotation" sekedar memberi sedikit sentuhan variasi pada template agar penggunjung dapat memperoleh kesan yang berbeda, sama seperti halnya dengan "Switch Stylesheets".
Ragam "Random Background Rotation"
1. Cut & Paste Random background color (javascript)
2. Random Content Colors script (javascript)
3. Random Image Rotation (php)
Sebenarnya masih banyak cara lain, tapi saya baru mencoba di 3 alamat tersebut, dan akhirnya saya memutuskan untuk blog dokumentasi ini adalah "Random Image Rotation" dengan script php, dibanding dengan javascript, karena di dua tempat tersebut javascriptnya ada error ketika saya cek di validasi html.
Penerapan "Random Image Rotation"
Karena blog ini ber platform blogger, tentu ada masalah ketika menggunakan "Random Image Rotation", masalahnya adalah dalam penyimpanan file source php serta imagenya yang perlu di bungkus dalam satu folder, mau ngak mau, akhirnya filenya saya parkir di tempat penyimpanan gratis yang dapat membaca file php, dengan resiko tiap reload tidak berjalan sempurna perubahnnya (silahkan reload blog ini untuk melihat hasilnya).
Inti dari konsep "Random Image Rotation" ini adalah merotasi secara random image, jadi apapun imagenya dapat ada gunakan trik ini, seperti image pada header atau sidebar dan lainnya, tapi pada blog ini kebutuhannya untuk merubah image pada background template.
Langkah penerapan "Random Image Rotation" atau Rotasi Background tiap Reload:
1. Download source php nya, kemudian ubah menjadi file txt tersebut menjadi php dengan nama "rotate.php".
2. Karena hanya butuh 3 perubahan warna, maka saya membuat 3 image dengan warna merah, biru dan kuning, menggunakan photoshop berukuran 40x40 pixel.
3. Membuat folder, foldernya saya berinama "reload". Dalam folder tersebut berisi selain 3 image dengan warna yang berbeda, juga file source php hasil download tadi yang telah dirubah ext. bernama "rotate.php". Jadi keseluruhan dalam folder tersebut 4 file (3 image + 1 file php)
4. Upload folder yang saya berinama "reload" tersebut ke tempat hostingan, kemudian copy link file "rotate.php" didalam folder "reload", seperti berikut, yang saya miliki:
http://choen.freevar.com/reload/rotate.php
link "rotate.php" ini yang akan membaca image di dalam folder "reload" secara bergiliran ketika reload (F5).
5. Masukan link "rotate.php" tersebut kedalam script CSS template anda, karena saya merubah background body, script seperti ini:
body {background:#525a4a url(http://choen.freevar.com/reload/rotate.php); }
6. Sip Selesai... silahkan me-reload.
lihat: weblog yang menggunakan random background
0 comments:
Posting Komentar