Wednesday, December 05, 2012
Kali ini kita akan membahas tentang cara mengubah tampilan kursor yang ada di blog kita. Jika kawan semua masih penasaran dengan yang dimaksud mengubah kursur, bagi kawan semua yang ingin mengubah kursor yang ada di blog kawan, maka bisa mengubahnya melalui langkah-langkah berikut:
2. Lalu klik "Layout"
3. Pilih "add a gadget" lalu pilih "HTML/Java Script" dan paste-kan kode berikut untuk mulai mengubah tampilan kursor yang ada di blog sobat:
a. Kode 1: mengubah kursor tapi tidak mengubah kursor ketika menyorot link
<style type="text/css">
body{cursor: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhYii3d6aX5N9z6c5pwDI2YkRKOuG-liQbavMu-SXwwowAET7Odbao4Md_XSehLTV0xBjc6IiNSKK48VpZeveGPwRD-LqN0pnofnuWS03qLMhMaMnTSZVfUMezjR-pQWytCu0TlhgIwHMKg/"), auto;}
</style>
body{cursor: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhYii3d6aX5N9z6c5pwDI2YkRKOuG-liQbavMu-SXwwowAET7Odbao4Md_XSehLTV0xBjc6IiNSKK48VpZeveGPwRD-LqN0pnofnuWS03qLMhMaMnTSZVfUMezjR-pQWytCu0TlhgIwHMKg/"), auto;}
</style>
b. Kode 2: mengubah kursor serta tetap berubah walau disorot ke arah link
<style type="text/css">
body{cursor: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhYii3d6aX5N9z6c5pwDI2YkRKOuG-liQbavMu-SXwwowAET7Odbao4Md_XSehLTV0xBjc6IiNSKK48VpZeveGPwRD-LqN0pnofnuWS03qLMhMaMnTSZVfUMezjR-pQWytCu0TlhgIwHMKg/"), auto;}
body a:hover{cursor: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhYii3d6aX5N9z6c5pwDI2YkRKOuG-liQbavMu-SXwwowAET7Odbao4Md_XSehLTV0xBjc6IiNSKK48VpZeveGPwRD-LqN0pnofnuWS03qLMhMaMnTSZVfUMezjR-pQWytCu0TlhgIwHMKg/"), auto;}
</style>
body{cursor: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhYii3d6aX5N9z6c5pwDI2YkRKOuG-liQbavMu-SXwwowAET7Odbao4Md_XSehLTV0xBjc6IiNSKK48VpZeveGPwRD-LqN0pnofnuWS03qLMhMaMnTSZVfUMezjR-pQWytCu0TlhgIwHMKg/"), auto;}
body a:hover{cursor: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhYii3d6aX5N9z6c5pwDI2YkRKOuG-liQbavMu-SXwwowAET7Odbao4Md_XSehLTV0xBjc6IiNSKK48VpZeveGPwRD-LqN0pnofnuWS03qLMhMaMnTSZVfUMezjR-pQWytCu0TlhgIwHMKg/"), auto;}
</style>
4. Jika sudah, maka silahkan untuk tekan tombol "SAVE" atau "SIMPAN"
Atau cara lainnya yang saya pake, yaitu
1. Login ke blog kita
2. Pilih tab Rancangan (Design) > Edit HTML
3. Cari kode </head> kemudian copy paste kan kode dibawah ini tepat di atas kode </head>
<style type="text/css">
body{cursor: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhYii3d6aX5N9z6c5pwDI2YkRKOuG-liQbavMu-SXwwowAET7Odbao4Md_XSehLTV0xBjc6IiNSKK48VpZeveGPwRD-LqN0pnofnuWS03qLMhMaMnTSZVfUMezjR-pQWytCu0TlhgIwHMKg/"), auto;}
body a:hover{cursor: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhYii3d6aX5N9z6c5pwDI2YkRKOuG-liQbavMu-SXwwowAET7Odbao4Md_XSehLTV0xBjc6IiNSKK48VpZeveGPwRD-LqN0pnofnuWS03qLMhMaMnTSZVfUMezjR-pQWytCu0TlhgIwHMKg/"), auto;}
</style>
body{cursor: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhYii3d6aX5N9z6c5pwDI2YkRKOuG-liQbavMu-SXwwowAET7Odbao4Md_XSehLTV0xBjc6IiNSKK48VpZeveGPwRD-LqN0pnofnuWS03qLMhMaMnTSZVfUMezjR-pQWytCu0TlhgIwHMKg/"), auto;}
body a:hover{cursor: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhYii3d6aX5N9z6c5pwDI2YkRKOuG-liQbavMu-SXwwowAET7Odbao4Md_XSehLTV0xBjc6IiNSKK48VpZeveGPwRD-LqN0pnofnuWS03qLMhMaMnTSZVfUMezjR-pQWytCu0TlhgIwHMKg/"), auto;}
</style>
4. Simpan dan lihat hasilnya, atau sebelum disimpan coba pratinjau terlebih dahulu supaya kita tahu bekerja atau tidak kode yang kita pasang. :)
PENTING:
Kawan Semua bisa mengganti link gambar yang telah saya tandai warna biru dengan link gambar kursor sesuai keinginan kawan semua.
Trima kasih kawan atas kunjungannya :)
Post a Comment