Lompat ke konten Lompat ke sidebar Lompat ke footer
Beranda / Blog

Merubah tampilan cursor di blog dengan gambar sendiri

Posting Komentar

Merubah tampilan cursor di blog dengan gambar sendiri

Saat saya menulis ini terinspirasi dari mengunjungi blog lain,pada saat itu tampilan cursor tiba-tiba berubah, akhirnya saya coba untuk merubah tampilan cursor di blog Goresan Si blogger 2 sampai berhasil.
Untuk itu saya akan membagi pengetahuan ini kepada anda lewat tulisan yang berjudul Merubah tampilan cursor di blog dengan gambar sendiri. merubah tampilan cursor di blog selain membuat keren tampilan blog untuk pengunjung dapat menambah pengetahuan tentang kode html. baiklah tanpa basah-basih kita langsung pada prakteknya di bawah ini :
Merubah tampilan cursor di blog dengan gambar sendir
Contoh cursor.

Pertama anda cari atau download gambar cursor di internet, atau anda mahir dalam mengunakan photoshop atau corel draw silakan anda buat dulu di kedua aplikasi tersebut, setelah selesai silakan di simpan di satu folder dan ikuti proses selanjutnya di bawah ini :

Untuk melihat URl-Gambar :

  • Masuk ke blogger anda.

  • Pilih postingan dan entri baru.

  • Buat postingan baru dan upload gambar anda.

  • Pilih mode HTML dan lihat Url-gambar anda.

  • Copy URL-gambar anda.

Setelah anda selesai dengan proses di atas silakan anda simpan dulu url-gambar yang anda copy tadi dan kemudian anda kembali ke blogger anda dan ikuti proses selanjutnya di bawah ini :

  • Masuk ke blogger anda.

  • Pilih tema dan edit html.





  • Cari kode
    </head>

    • kemudian copy kode dibawah ini :

    <style type="text/css">
    body{cursor: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgUtbTeX6nzbqz3CxgtVo8j2lpqVU2sKils_5dmkZQNFThVizT0YIiX7cEUguJYvTS0NiHee3Ny0pvxwLeymEtyxtYUQsnkRntWAjRn3ZnVSffmYYLaeNg9Zma8nSFgQFBNGlUCvbh3Ot5Q/s320/ungke-14.png"), auto;}
    body a:hover{cursor: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgUtbTeX6nzbqz3CxgtVo8j2lpqVU2sKils_5dmkZQNFThVizT0YIiX7cEUguJYvTS0NiHee3Ny0pvxwLeymEtyxtYUQsnkRntWAjRn3ZnVSffmYYLaeNg9Zma8nSFgQFBNGlUCvbh3Ot5Q/s320/ungke-14.png"), auto;}
    </style>


    pastekan kode di atas tepat di atas kode
    </head>
     Ganti url gambar di kode di atas dengan url gambar yang anda simpan di proses pertama tadi di code yang saya beri tanda merah di atas. demikianlah cara merubah tampilan cursor di blog dengan gambar sendiri. Jika anda tidak memiliki gambar cursor silakan pilih tampilan cursor yang saya buat di bawah ini yang cocok untuk anda :

      1. lihat gambar :

      Merubah tampilan cursor di blog dengan gambar sendiri
      cursor no 1
      Copy kode di bawah ini
      <style type="text/css">
      body{cursor: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKcd3tLKV4Q8uE-sQcneMz_885-KN2puxOtrHyCqqqb6nbBh9vxN73aRkKcf6Djb0F9Nac3vIg-2909gr03O9f6yys6F6EyBUV-EC-xHtn-99pC4kuzpNSfxIAROYQ1aTgvIWsXVKcWvkd/s1600/ungke.png"), auto;}
      body a:hover{cursor: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKcd3tLKV4Q8uE-sQcneMz_885-KN2puxOtrHyCqqqb6nbBh9vxN73aRkKcf6Djb0F9Nac3vIg-2909gr03O9f6yys6F6EyBUV-EC-xHtn-99pC4kuzpNSfxIAROYQ1aTgvIWsXVKcWvkd/s1600/ungke.png"), auto;}
      </style>

      2. Lihat gambar :

      Merubah tampilan cursor di blog dengan gambar sendiri
      cursor no 2
      Copy kode di bawah ini
      <style type="text/css">
      body{cursor: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKcd3tLKV4Q8uE-sQcneMz_885-KN2puxOtrHyCqqqb6nbBh9vxN73aRkKcf6Djb0F9Nac3vIg-2909gr03O9f6yys6F6EyBUV-EC-xHtn-99pC4kuzpNSfxIAROYQ1aTgvIWsXVKcWvkd/s1600/ungke.png"), auto;}
      body a:hover{cursor: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKcd3tLKV4Q8uE-sQcneMz_885-KN2puxOtrHyCqqqb6nbBh9vxN73aRkKcf6Djb0F9Nac3vIg-2909gr03O9f6yys6F6EyBUV-EC-xHtn-99pC4kuzpNSfxIAROYQ1aTgvIWsXVKcWvkd/s1600/ungke.png"), auto;}
      </style>

      3. Lihat gambar.

    Merubah tampilan cursor di blog dengan gambar sendiri
    cursor no 3
    Copy kode di bawah ini
    <style type="text/css">
    body{cursor: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjzNNfqe1bgIKsft1di6qu8sn2LLfVXSOvHJ9p8Spvx4Dc_z8_GNXpW-cGMCmeOdJStMG0QIJ6H-BcKaH9axbPjQYMXbcdzf5RRbot7br905Hg-OLmyYbO041jfg8dzhhDTWpQPux8YkUpH/s1600/ungke-3.png"), auto;}
    body a:hover{cursor: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjzNNfqe1bgIKsft1di6qu8sn2LLfVXSOvHJ9p8Spvx4Dc_z8_GNXpW-cGMCmeOdJStMG0QIJ6H-BcKaH9axbPjQYMXbcdzf5RRbot7br905Hg-OLmyYbO041jfg8dzhhDTWpQPux8YkUpH/s1600/ungke-3.png"), auto;}
    </style>

    4. Lihat gambar .

    Merubah tampilan cursor di blog dengan gambar sendiri
    cursor no 4
    Copy kode di bawah ini
    <style type="text/css">
    body{cursor: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiLJ9KE1rpX1Ib74te6PcGLM8bLX70X7b8srBjmv4htTpQVpivgQjLaBJB-RNRN5_i4eiRpGPeAP67JU4eFbCID9ZqOgJroRzA5zm-sgrGnuprzxqIMYZ5sTMRYgPBKNkFKdUnuGgBKajeg/s1600/ungke-4.png" ), auto;}
    body a:hover{cursor: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiLJ9KE1rpX1Ib74te6PcGLM8bLX70X7b8srBjmv4htTpQVpivgQjLaBJB-RNRN5_i4eiRpGPeAP67JU4eFbCID9ZqOgJroRzA5zm-sgrGnuprzxqIMYZ5sTMRYgPBKNkFKdUnuGgBKajeg/s1600/ungke-4.png" ;), auto;}
    </style>

    5. Lihat gambar.

    Merubah tampilan cursor di blog dengan gambar sendiri
    cursor no 5
    Copy kode di bawah ini
    <style type="text/css">
    body{cursor: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjMy6T5uzs4z9mf-_lFXXOYNKOZ_LBlp5dkXRxoMTl2O7VCvwzlfkivxQe_E-5fJ7QGFxToW9YS6RS1EaAOfmrEYT8cCDqyELR1d7MPXWL_gdxWv4xNHj1juJn5JGMONTyqaGnVD0-ttynp/s1600/ungke-5.png"), auto;}
    body a:hover{cursor: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjMy6T5uzs4z9mf-_lFXXOYNKOZ_LBlp5dkXRxoMTl2O7VCvwzlfkivxQe_E-5fJ7QGFxToW9YS6RS1EaAOfmrEYT8cCDqyELR1d7MPXWL_gdxWv4xNHj1juJn5JGMONTyqaGnVD0-ttynp/s1600/ungke-5.png";), auto;}
    </style>

    6. Lihat gambar.

    Merubah tampilan cursor di blog dengan gambar sendiri
    cursor no 6
    Copy kode di bawah ini
    &lt;style type=&quot;text/css&quot;&gt;
    body{cursor: url(&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjMy6T5uzs4z9mf-_lFXXOYNKOZ_LBlp5dkXRxoMTl2O7VCvwzlfkivxQe_E-5fJ7QGFxToW9YS6RS1EaAOfmrEYT8cCDqyELR1d7MPXWL_gdxWv4xNHj1juJn5JGMONTyqaGnVD0-ttynp/s1600/ungke-5.png&quot;), auto;}
    body a:hover{cursor: url(&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjMy6T5uzs4z9mf-_lFXXOYNKOZ_LBlp5dkXRxoMTl2O7VCvwzlfkivxQe_E-5fJ7QGFxToW9YS6RS1EaAOfmrEYT8cCDqyELR1d7MPXWL_gdxWv4xNHj1juJn5JGMONTyqaGnVD0-ttynp/s1600/ungke-5.png&quot;;), auto;}
    &lt;/style&gt;

    7. Lihat gambar.
    Merubah tampilan cursor di blog dengan gambar sendiri
    cursor no 7
    Copy kode di bawah ini
    <style type="text/css"> body{cursor: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgrasTMqXqhipqhmKa4esdXHY1atQT_AKZEcDOzEvdI63MieEFTmnhgZiQaOAN8h01iJV5bcPzJnsLR-Ki8U0BG5ki1XPjw5DQdBSf_reCraJGaPfxGcts32dbN4NL34H6kRQ7nxSaYhqOL/s1600/ungke-7.png"), auto;} body a:hover{cursor: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgrasTMqXqhipqhmKa4esdXHY1atQT_AKZEcDOzEvdI63MieEFTmnhgZiQaOAN8h01iJV5bcPzJnsLR-Ki8U0BG5ki1XPjw5DQdBSf_reCraJGaPfxGcts32dbN4NL34H6kRQ7nxSaYhqOL/s1600/ungke-7.png"), auto;} </style>

    8. Lihat gambar.

    Merubah tampilan cursor di blog dengan gambar sendiri
    cursor no 8
    Copy kode di bawah ini
    <style type="text/css"> body{cursor: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg5ZlRyxs3dtmgDSmLhDSZ7h8kMq3yTGn6G2RXtBdHgpgdv79Q2kivp8bIeevFmAi7rVckaoPc0l68I5xoCMP9QwRptsq21fvSuXsI32OOuwihVrJOE5JIkVZ4ZouVpMsPzi3DXZOhA8NL-/s1600/ungke-8.png"), auto;} body a:hover{cursor: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg5ZlRyxs3dtmgDSmLhDSZ7h8kMq3yTGn6G2RXtBdHgpgdv79Q2kivp8bIeevFmAi7rVckaoPc0l68I5xoCMP9QwRptsq21fvSuXsI32OOuwihVrJOE5JIkVZ4ZouVpMsPzi3DXZOhA8NL-/s1600/ungke-8.png"), auto;} </style>

    9. Lihat gambar.

    Merubah tampilan cursor di blog dengan gambar sendiri
    cursor no 9
    Copy kode di bawah ini
    <style type="text/css"> body{cursor: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg5ZlRyxs3dtmgDSmLhDSZ7h8kMq3yTGn6G2RXtBdHgpgdv79Q2kivp8bIeevFmAi7rVckaoPc0l68I5xoCMP9QwRptsq21fvSuXsI32OOuwihVrJOE5JIkVZ4ZouVpMsPzi3DXZOhA8NL-/s1600/ungke-8.png"), auto;} body a:hover{cursor: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg5ZlRyxs3dtmgDSmLhDSZ7h8kMq3yTGn6G2RXtBdHgpgdv79Q2kivp8bIeevFmAi7rVckaoPc0l68I5xoCMP9QwRptsq21fvSuXsI32OOuwihVrJOE5JIkVZ4ZouVpMsPzi3DXZOhA8NL-/s1600/ungke-8.png"), auto;} </style>

    10. Lihat gambar.

    Merubah tampilan cursor di blog dengan gambar sendiri
    cursor no 10
    Copy kode di bawah ini
    <style type="text/css">
    body{cursor: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgkrHbgFLbcykMI3gl_p5xq6qWgADq_PK2CdylY99sPNerwecnPCzEqmf0JfsohyphenhyphenYvHXeXXd77UR1rzAyvklueo8zJ3LtCraKapgkeBpRYFaNe2WjLi3dUJSjZ1h2ux9Nb9PWFT0-1emxc6/s1600/ungke-9.png"), auto;}
    body a:hover{cursor: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgkrHbgFLbcykMI3gl_p5xq6qWgADq_PK2CdylY99sPNerwecnPCzEqmf0JfsohyphenhyphenYvHXeXXd77UR1rzAyvklueo8zJ3LtCraKapgkeBpRYFaNe2WjLi3dUJSjZ1h2ux9Nb9PWFT0-1emxc6/s1600/ungke-9.png"), auto;}
    </style>

    11. Lihat gambar.

    Merubah tampilan cursor di blog dengan gambar sendiri
    cursor no 11
    Copy kode di bawah ini
    <style type="text/css">
    body{cursor: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_zeDBdpwWbWSi3EjUxrlEZx7bXv5UwXq88t4KZquRpFms90E1B7-GzJzJVW1uphdch2jPfQS930f0QfaEDWPeYF3XkaleDWoo8CM-DsZIZF7nMSz3uK_zQcCiy6bHzD2PgcBtVRBBNqIv/s1600/ungke-11.png"), auto;}
    body a:hover{cursor: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_zeDBdpwWbWSi3EjUxrlEZx7bXv5UwXq88t4KZquRpFms90E1B7-GzJzJVW1uphdch2jPfQS930f0QfaEDWPeYF3XkaleDWoo8CM-DsZIZF7nMSz3uK_zQcCiy6bHzD2PgcBtVRBBNqIv/s1600/ungke-11.png"), auto;}
    </style>

    12. Lihat gambar.

    Merubah tampilan cursor di blog dengan gambar sendiri
    cursor no 12
    Copy kode di bawah ini
    <style type="text/css">
    body{cursor: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiaEtx36o-3Aoy7EG6gD1jWb6SX67g_Uap9J5NK91OoHf5fxl8t7oXrhFdcGLBEMPRbYZdFNZCXEI3gvjdNl5LbmK2LxWK4TGfVeBfT7MTrq2nPwV9caD9ry3zy8t1Ng9Ozty_nl7j2BSEl/s1600/ungke-12.png"), auto;}
    body a:hover{cursor: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiaEtx36o-3Aoy7EG6gD1jWb6SX67g_Uap9J5NK91OoHf5fxl8t7oXrhFdcGLBEMPRbYZdFNZCXEI3gvjdNl5LbmK2LxWK4TGfVeBfT7MTrq2nPwV9caD9ry3zy8t1Ng9Ozty_nl7j2BSEl/s1600/ungke-12.png"), auto;}
    </style>

    13. Lihat gambar.

    Merubah tampilan cursor di blog dengan gambar sendiri
    cursor no 13
    Copy kode di bawah ini
    <style type="text/css">
    body{cursor: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhz0Q4rf_mqyq72A6EUsHcDyWUcJHxZMDRkyP0S5KjTCtv7mImnHS5pUS8gk-rqcKi-YLP-4660xzcRnztVeSsZvV7jFbq0FrbAvYYJI6Cw2atCkA1KE0C02GK74Oj7bfiTfcbBU_PfrT8f/s1600/ungke-13.png"), auto;}
    body a:hover{cursor: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhz0Q4rf_mqyq72A6EUsHcDyWUcJHxZMDRkyP0S5KjTCtv7mImnHS5pUS8gk-rqcKi-YLP-4660xzcRnztVeSsZvV7jFbq0FrbAvYYJI6Cw2atCkA1KE0C02GK74Oj7bfiTfcbBU_PfrT8f/s1600/ungke-13.png"), auto;}
    </style>
    - Goresan Si blogger 2 -

    Setelah anda memilih salah satu contoh gambar cursor dan langsung di copy kodenya dan di pastekan di atas kode
    </head>
    jangan sampai salah penempatannya.
    demikianlah merubah tampilan cursor di blog dengan gambar sendiri.
    Lokasi:

    Posting Komentar untuk "Merubah tampilan cursor di blog dengan gambar sendiri"

    Silahkan berkomentar sesuai dengan topik,jika komentar dengan kata kotor atau kasar di angap spam. ! Terima kasih