mengganti kursor pada blog

Merubah Image atau Tampilan Kursor Pada Blog : Pada postingan yang lalu, di sini, telah dijelaskan cara mengkustomasi bentuk kursor mouse yang diaplikasikan untuk teks tertentu dalam suatu postingan dengan memanfaatkan bentuk kursor yng ada (bawaan/default Windows). Nah, pada kesempatan ini, Tips dan Trik Blog akan memberikan script untuk merubah kursor mouse di mana bentuk/image kursornya dapat dikustomasi (diganti) sesuai kehendak atau selera masing-masing.

Langkah-langkahnya dapat dilakukan dengan dua cara yaitu menambah script pada gadget/widget dan merubah kode css.

CARA PERTAMA
Menambahkan Script Pada Gadget

Untuk melakukannya tidak memerlukan langkah-langkah yang rumit. Yang perlu kita lakukan hanyalah melakukan copy paste atas script yang akan saya berikut ini pada gadget/widget blog kita. Dengan script tersebut, bentuk/image kursor mouse tidak hanya berlaku pada teks tertentu saja namun pada keseluruhan bodi blog.

Formatnya seperti di bawah ini.




Keterangan

Ganti URL_Image_Kursor dengan alamat/direktori image kita.

Misalkan alamat image kita adalah http://www.geocities.com/yono_pati/baby1.gif maka script-nya menjadi seperti di bawah ini.




Selanjutnya,…..

Pertama, login ke blogger hingga masuk Dasbor >> Tata Letak (layout) >> Tambah Gadget >> Tambahkan HTML/Javascript
Kedua, copy paste script di atas
Ketiga, Simpan Perubahan
Keempat, selesai


CARA KEDUA
Melakukan Perubahan Pada Kode CSS

Bagi yang blognya sudah terlalu banyak memuat widget/gadget untuk script-script yang lain, jika menginginkan, kita dapat melakukannya dengan merubah pada kode css-nya. Jika demikian, langkah-langkahnya adalah sebagai berikut.

Pertama, login ke blogger hingga masuk Dasbor >> Tata Letak (layout) >> Edit HTML
Kedua, centangi “Expand Widget Template”
Ketiga, cari kode body {
Bagi pengguna Firefox, untuk mempermudah pencarian, gunakan Ctrl+F

Keempat, tempatkan format kode berikut ini dalam tag body { tersebut.

cursor : url("URL_Image_Kursor"), auto;

Sehingga selengkapnya menjadi seperti di bawah ini.

body {
cursor : url("URL_Image_Kursor"), auto;
………………………
………………………
}



Kelima, simpan template
Keenam, selesai.

Oh iya, jika tidak mau repot, kita dapat mengambil image untuk kursor di http://totallyfreecursors.com/. Di sana, kita dapat memilih dari berbagai kategori, seperti “animal”, “kartun”, “baby”, ‘animated”, “comics”, dan masih banyak lagi yang lainnya.

Untuk mempermudah para downloader, di sana, kita dapat langsung mendapatkan kode html-nya, jadi tidak perlu melakukan penyimpanan pada hosting sendiri namun jika menginginkan, kita juga dapat melakukannya dan menempatkan pada image hosting sendiri.


selamat mencoba...