Senin, 02 April 2012

Cara Merubah Tampilan Kursor Pada Blogspot


Anda bisa merubah tampilan Kursor menjadi berbeda-beda. Jika ingin mencoba silahkan ikuti langkah cara merubah tampilan Kursor di Blogspot anda. Caranya sangat mudah, hanya dengan menambahkan gadget Html/JavaScript di Tata Letak Blog kita dan memasukkan kode seperti dibawah maka anda akan melihat tampilan Kursor yang berbeda. OK kita simak dan coba cara merubah kursor untuk Blogspot berikut ini.



Cara merubah kursor untuk Blogspot:

* Masuk ke Blog anda dan klik '' Tata Letak ''
* Klik '' Tambah Gadget ( Add A Gadget )
* Pilih > HTML/JavaScript
* Kopi dan paste/masukkan kode di bawah, pada area konten html, pilih salah satu (banyak pilihan)




    <style type="text/css">
    body{cursor: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgNxVgW7sOoHoF4IVYhAMuzXrCNj0gR_T8ZHbW9G19UMJLW07dwqcQQ9-fF9Dp3Y_D3DgeR5ssb-Hxztr7PoRDFKnoehkkXGbkPmEDF0CPFsSVxhioo9mryImTP8LEeSs4wZZr9Rt_ZR1T7/s1600/jasablogsitus-web-id.gif"), auto;}
    </style>   


Anda juga bisa gunakan kode ke 2 dibawah ini (kursor berubah secara permanen)


    <style type="text/css">
    body{cursor: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgNxVgW7sOoHoF4IVYhAMuzXrCNj0gR_T8ZHbW9G19UMJLW07dwqcQQ9-fF9Dp3Y_D3DgeR5ssb-Hxztr7PoRDFKnoehkkXGbkPmEDF0CPFsSVxhioo9mryImTP8LEeSs4wZZr9Rt_ZR1T7/s1600/jasablogsitus-web-id.gif"), auto;}
    body a:hover{cursor: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgNxVgW7sOoHoF4IVYhAMuzXrCNj0gR_T8ZHbW9G19UMJLW07dwqcQQ9-fF9Dp3Y_D3DgeR5ssb-Hxztr7PoRDFKnoehkkXGbkPmEDF0CPFsSVxhioo9mryImTP8LEeSs4wZZr9Rt_ZR1T7/s1600/jasablogsitus-web-id.gif"), auto;}
    </style>




Ket: warna Merah bisa diganti dengan url gambar kursor yang diinginkan

* Simpan / save

Tambahan:
Berikut kode-kode html lainnya yang bisa anda pilih, karena tak semua kode bisa kita gunakan di template kita ( anda juga bisa mencari gambar kursor yang lain di mesin pencari google, pakai saja kata kunci free kursor, dan jangan lupa kopi kodenya).


1

<style type="text/css">
body, a:hover {cursor: url(http://cur.cursors-4u.net/cursors/cur-11/cur1038.cur), progress !important;}
</style><a href="http://www.cursors-4u.com/cursor/2012/02/10/pinky-design-pointer.html" target="_blank" title="Pinky Design Pointer"><img alt="Pinky Design Pointer" border="0" src="http://cur.cursors-4u.net/cursor.png" style="position: absolute; right: 0px; top: 0px;" /></a>

jika yang diatas gagal gunakan yang di bawah ini.

/* Start http://www.cursors-4u.com */ body, a:hover {cursor: url(http://cur.cursors-4u.net/cursors/cur-11/cur1038.cur), progress !important;} /* End http://www.cursors-4u.com */


2

<style type="text/css">
body, a:hover {cursor: url(http://cur.cursors-4u.net/cursors/cur-11/cur1017.ani), url(http://cur.cursors-4u.net/cursors/cur-11/cur1017.png), progress !important;}
</style><a href="http://www.cursors-4u.com/cursor/2012/01/22/x-steel-diagonal-resize-2.html" target="_blank" title="X-Steel - Diagonal Resize 2"><img alt="X-Steel - Diagonal Resize 2" border="0" src="http://cur.cursors-4u.net/cursor.png" style="position: absolute; right: 0px; top: 0px;" /></a>

jika yang diatas gagal gunakan yang di bawah ini.

/* Start http://www.cursors-4u.com */ body, a:hover {cursor: url(http://cur.cursors-4u.net/cursors/cur-11/cur1017.ani), url(http://cur.cursors-4u.net/cursors/cur-11/cur1017.png), progress !important;} /* End http://www.cursors-4u.com */


3

<style type="text/css">
body, a:hover {cursor: url(http://cur.cursors-4u.net/holidays/hol-6/hol512.ani), url(http://cur.cursors-4u.net/holidays/hol-6/hol512.png), progress !important;}
</style><a href="http://www.cursors-4u.com/cursor/2012/01/20/valentine-s-day-pumping-heart.html" target="_blank" title="Valentine's Day Pumping Heart"><img alt="Valentine's Day Pumping Heart" border="0" src="http://cur.cursors-4u.net/cursor.png" style="position: absolute; right: 0px; top: 0px;" /></a>

jika yang diatas gagal gunakan yang di bawah ini.

/* Start http://www.cursors-4u.com */ body, a:hover {cursor: url(http://cur.cursors-4u.net/holidays/hol-6/hol512.ani), url(http://cur.cursors-4u.net/holidays/hol-6/hol512.png), progress !important;} /* End http://www.cursors-4u.com */


4

<style type="text/css">
body, a:hover {cursor: url(http://cur.cursors-4u.net/cursors/cur-10/cur947.ani), url(http://cur.cursors-4u.net/cursors/cur-10/cur947.png), progress !important;}
</style><a href="http://www.cursors-4u.com/cursor/2011/12/26/batman-begins-unavailable.html" target="_blank" title="Batman Begins - Unavailable"><img alt="Batman Begins - Unavailable" border="0" src="http://cur.cursors-4u.net/cursor.png" style="position: absolute; right: 0px; top: 0px;" /></a>

jika yang diatas gagal gunakan yang di bawah ini.

/* Start http://www.cursors-4u.com */ body, a:hover {cursor: url(http://cur.cursors-4u.net/cursors/cur-10/cur947.ani), url(http://cur.cursors-4u.net/cursors/cur-10/cur947.png), progress !important;} /* End http://www.cursors-4u.com */

Nah dengan demikian langkah anda sudah selesai dan coba cek jika kurang puas anda bisa cari kode-kode bentuk kursor yang lain. Terimakasih untuk http://blog.ahmadrifai.net untuk artilel mantap ini dan silahkan temen-temen berkunjung ke sana.



Tidak ada komentar: