Wednesday, September 16, 2015

Cara Membuat Dan Mengganti Cursor Sendiri di Blog

Cara Mengganti Cursor Blog - Jika sobat masih suka dengan yang namanya utak-utik template blog sekarang ada lagi yang bisa sobat coba kerjakan yaitu mengubah cursor / mouse dengan gambar yang di buat sendiri sehingga gambar cursor berubah menjadi lebih unik dan 100% beda daripada yang lain. Dengan menggunakan gambar  buatan sendiri tentu menjadikan blog lebih ekspresif cursor ini yang biasanya berupa gambar panah bisa berubah menjadi gambar logo sobat. gambar tulisan, dan bisa apa saja. sebelum sobat mencoba melakukan tutorial ini terlebih dahulu kita akan membahas gambar yang akan kita buat sendiri disini saya memberikan contoh membuat gambar PNG dengan photoshop. bagi sobat yang belum pernah menggunakan photoshop mungkin saatnya berlatih dan anggap saja sebuah tantangan kecil. dan bagi yang sudha mahir dengan photoshop harus bisa membuat cursor menjadi lebih cantik dan lebih keren dari yang saya buat ini. hehe..

 Baca Juga :  Aplikasi / Software Edit Foto Terbaik Terbaru Gratis Dan Berbayar

Cara Membuat Gambar cursor mouse Sendiri dengan Photoshop CS3


Saya yakin hampir semua di antara sobat semua sudah kenal dengan namanya photoshop. Program ini sangat sempurna untuk membuat dan mengedit berbagai macam gambar seperti gambar PNG, GIF, JPG, dan lainnya kali ini kita akan membuat gambar PNG agar background nya tidak terlihat / transparent. 
  1. Pertama kali sobat bisa membuka program photoshop.
  2. Klik "file" lalu pilih "New" untuk membuat sebuah layer baru.
    cara membuat cursor blog sendiri

  3. Ukuran disini hanya sebagai contoh saja, misalkan saja width/lebar : 75pixels, height/tinggi : 40 pixels dan resolusi 70 pixels dan lain sebagainya. jika sudah selesai mengukur dan menamai layer pilih "oke"
    cara membuat cursor sendiri untuk blog

  4. Pastikan sobat berada di posisi move tool, dan cecklist bagian select tool dan auto transform controls, agar bisa mempermudah merubah / merotasi posisi gambar nantinya.

    cara mengganti cursor blog

  5. Lalu memilih shape / bentuk dari custom shape tool. 
    cara membuat dan mengganti cursore blog

  6. Saya memberi tambahan agar gambar mempunyai bayangan dengan klik kanan pada layer yang ada di sebelah kanan, saya pilih "blending option
    cara mengganti cursor mouse

  7. Cecklist pada "drop shadow'  
    cara membuat cursor untuk blog

  8. Kemudian gambar di putar sesuai keinginan.
    cara mengganti kursor di blog
     
  9. Tambahkan juga bisa di tambahkan tulisan dengan "text tool"
    cara membuat cursor blogger
  10. Jika sudah puas dengan editan gambarnya. saatnya menyimpan gambar tersebut menjadi PNG.
    cara mengubah kursor pada blog

  11. Saya beri nama gambar tersebut dengan cursor blog lalu saya memilih PNG sebagai extensi gambar agar background tidak terlihat/ transparant. 
    cara mengganti mouse di blog

  12. Sobat bisa membuat gambar tersebut dua buah gambar yang hampir mirip, satunya lagi untuk gambar hover yaitu gambar yang berubah ketika gambar mengarah ke link. sobat tentu mengetahui jika cursor dalam keadaan normal akan berbentuk "panah", namun jika berada di posisi link gambar akan berubah menjadi "tangan". dan Berikutnya adalah mengupload gambar tersebut ke internet, caranya bisa dengan mengupload ke blogger caranya persis seperti saat sobat mengupload gambar pada artikel sobat yang akan sobat publish, namun untuk gambar biasanya saya mengupload lewat laman tanpa mempublishnya. 
    cara upload cursor blog ke blogger

  13. upload gambar seperti biasa, dan pada posisi HTML copy url gambar tersebut. dan sobat tidak perlu mempublish page tersebut, karena meski tidak di publish gambar masih bisa di pakai. silahkan close saja. 

  14. Simpan Url cursor yag sudah sobat copy tadi di notepad dahulu. 


Cara mengganti Cursor Blog Dengan Cursor Buatan Sendiri

Sampai disini saya anggap sobat sudah membuat gambar cursor dan sudah mengupload ke blogger, langkah selanjutnya adalah merubah cursore yang ada di blog bisa tampil seuai dengan keinginan. sampai di sini sobat bisa melakukan dengan mudah step-step berikut ini.

  1. Pertama kita masuk ke blogger pilih "Template" lalu "Edit template
    cara mengubah cursor pada blog

  2. Berikutnya copy code warna biru berikut ini dan ganti kode yang berwarna merah dengan ULR cursor milik sobat sendiri. cursor yang hover maksudnya adalah gambar cursor akan berubah ketika cursor di arahkan ke link.

    <style type="text/css">body{cursor: url("http://3.bp.blogspot.com/-gdUhANnvxt8/VfpXApsiRZI/AAAAAAAACx0/MnC53hep6S8/s1600/cursor.png"), auto;}body a:hover{cursor: url("http://3.bp.blogspot.com/-gdUhANnvxt8/VfpXApsiRZI/AAAAAAAACx0/MnC53hep6S8/s1600/cursor2.png"), auto;}</style>

    lalu pastekan di atas kode </head>  . jika sudah silahkan simpan template
    mengganti kode cursor blog sendiri
     
  3. Lihat hasilnya. 

Terima kasih semoga proses mengganti cursor blog berjalan sukses. selamat mencoba

1 comments: