Mengkustomasi Kursor Pada Bodi Postingan

Posted by Unknown on Sunday, April 19, 2009

Membuat Tampilan Kursor Pada Bodi Postingan : Pada postingan terdahulu, di sini, telah dijelaskan cara membuat tampilan kursor pada seluruh bodi blog dan sekarang kita akan membuat tampilan kursor hanya pada bodi postingan. Jadi, kursor mouse akan berubah sesuai yang kita kehendaki hanya pada bodi postingan saja sedangkan di area lainnya bentuk kursornya standar. Jika tertarik, silakan ikuti tipsnya bersama Tips Trik Ngeblog berikut ini.

Seperti tips sebelumnya (membuat tampilan kursor pada bodi blog), pada tips ini pun dapat dilakukan dengan dua cara, pertama, copy paste script pada gadget dan kedua, menambahkan kode pada kode css.

Cara Pertama
Copy Paste Script pada Gadget

Untuk mendapatkan tampilan kursor hanya pada bodi postingan dengan cara yang pertama ini, yang perlu kita lakukan adalah melakukan copy paste atas script berikut ini pada gadget blog kita. Berikut format script-nya.

<style>HTML>BODY .post-body{cursor:url("URL_Image_Kursor"), auto;}</style>


Keterangan

Ganti URL_Image_Kursor dengan alamat URL atau direktori image kita

Misalkan alamat URL image kita adalah http://geocities.com/yono_pati/baby1.gif maka selengkapnya akan menjadi seperti di bawah ini.

<style>HTML>BODY .post-body {cursor:url("http://geocities.com/yono_pati/baby1.gif"), auto;}</style>


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
Menambahkan Kode Pada CSS

Selain cara di atas, kita juga dapat melakukannya dengan merubah pada kode css-nya. 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 .post-body {
Bagi pengguna Firefox, untuk mempermudah pencarian, gunakan Ctrl+F

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

cursor : url("URL_Image_Kursor"), auto;


Sehingga selengkapnya menjadi seperti di bawah ini.

.post-body {
cursor: url(“http://geocities.com/yono_pati/baby1.gif”), auto;
……………………..
……………………..
}


Kelima, simpan template
Keenam, selesai

Sekali lagi yang tidak ingin repot-repot membuatnya, kita dapat mengambil image untuk kursor di http://totallyfreecursors.com/. Di sana, tersedia ratusan bahkan ribuan image untuk kursor ini dengan berbagai pilihan dan kategori.

Selamat Mencoba!!

Baca juga yang ini

Kustomasi Kursor Pada Teks Tertentu Dalam Postingan

Merubah Tampilan Kursor Pada Bodi Blog
Membuat Postingan Dua Kolom
Kumpulan Script Untuk Mempercantik Blog

Description: Mengkustomasi Kursor Pada Bodi Postingan Rating: 4.5 Reviewer: Unknown - ItemReviewed: Mengkustomasi Kursor Pada Bodi Postingan

{ 0 comments... read them below or add one }

Post a Comment