.

Sabtu, 18 Agustus 2012

Membuat Cursor Animasi Di blog

Kali ini saya juga ingin share ilmu tentang Cara Mengganti Cursor Blog. Secara default, cursor blog berbentuk panah, namun jika sobat bosan dengan tampilan itu, sobat bisa merubahnya sesuka kehendak sobat. Pengunjung juga akan merasa sedikit terhibur . Jika sobat berminat, silahkan ikuti tutorial berikut ini. Untuk membuat sebuah kursor animasi, langkah pertama yang harus di lakukan adalah membuat sebuah gambar animasi yang berukuran kecil, untuk yang ini terserah kepada keahlian sobat, banyak software pembuat animasi semisal macromedia flash atau sejenis itu. Jika sobat tidak bisa membuat sebuah gambar animasi untuk di pakai, jangan dulu putus harapan. Sobat bisa mencarinya di internet, ratusan atau bahkan ribuan situs menyediakan layanan ini. Caranya sangat mudah, sobat bisa mencarinya lewat search engine yang ada di sebelah kanan atas blog ini. Tuliskan keyword yang berhubungan, misal : Cursor animationFree cursor animated atau keyword lainnya.

Langkah kedua yaitu menyimpan file animasi yang sudah sobat dapatkan ke hosting tempat menyimpan gambar, contoh : http://www.photobucket.com atau di https://picasaweb.google.com atau bisa juga di blogger sendiri juga bisa.. Apabila gambar animasi sudah si upload, catat alamat gambar tersebut. Sebagai contoh, saya mempunyai gambar cursor berbentuk naga terbang dengan alamat sebagai berikut :

http://white-crime.googlepages.com/dragon3.ani (cuman sebagai bcontoh)

Langkah selanjutnya adalah menyisipkan kode untuk kursor. Kode untuk membentuk kursor adalah sebagai berikut :

cursor: url(“alamat gambar kursor”);

Sebagai contoh, jika saya menggunakan alamat kursor yang saya miliki, kode nya jadi seperti ini :

cursor: url(“http://white-crime.googlepages.com/dragon3.ani”);

Langkah selanjutnya yang harus di lakukan adalah memasukan kode di atas ke dalam kode template sobat, agar lebih mudah untuk di pahami, saya tuliskan langkah-langkahnya :


  • Untuk template klasik



  1. Sign in di blogger.

  2. Klik menu Template

  3. Klik menu Edit HTML

  4. Copy seluruh kode template yang ada, lalu save untuk backup data

  5. Cari kode yang mirip dengan kode di bawah ini, biasanya di tulis dengan body :



      body {background:#fff;

      margin:0;padding:40px 20px;

      font:x-small Georgia,Serif;

      text-align:center;

      color:#333;

      font-size/* */:/**/small;


    font-size: /**/small;

    }


  1. Sisipkan kode kursor di dalam kode tadi, sehingga seperti ini :


    body{

    background:#fff;

    margin:0;

    padding:40px 20px;

    font:x-small Georgia,Serif;

    text-align:center;

    color:#333;

    font-size/* */:/**/small;

    font-size: /**/small;


      cursor: url(“http://white-crime.googlepages.com/dragon3.ani”);


    }


  1. Klik tombol Simpan Perubahan Template

  2. Selesai. Silahkan lihat hasilnya.



  • Untuk template baru



  1. Sign in di blogger

  2. Klik menu Layout

  3. Klik menu Edit HTML

  4. Klik link Download template seluruhnya, save dulu untuk backup biar aman

  5. Cari kode yang mirip dengan kode dibawah, biasanya di tulis dengan body :


    body {

    background:$bgcolor;

    margin:0;

    color:$textcolor;

    font:x-small Georgia Serif;

    font-size/* */:/**/small;

    font-size: /**/small;

    text-align: justify;

    }


  1. Sisipkan kode kursor di dalam kode tadi, sehingga seperti ini :


    body {

    background:$bgcolor;

    margin:0;

    color:$textcolor;

    font:x-small Georgia Serif;

    font-size/* */:/**/small;

    font-size: /**/small;

    text-align: justify;


      cursor: url(“http://white-crime.googlepages.com/dragon3.ani”);


    }


  1. Klik tombol Simpan Template

  2. Selesai. Silahkan lihat hasilnya.


Atau ada juga cara lain, yaitu di tempatkan di dalam kode <body>, sobat tinggal menyisipkannya sehingga kodenya jadi seperti ini :
<body style=’CURSOR: url(“http://white-crime.googlepages.com/dragon3.ani”)’>


sobat bisa cari url cursor di http://www.totallyfreecursors.com/, http://www.123cursors.com/ dan http://www.cursors-4u.com/;



Semoga bermanfaat yach...salam white-crime.com :2thumbup

2 komentar:

ijul mengatakan...

makasih mas

admin mengatakan...

sami2

Posting Komentar

 
 
Copyright © white-crime
Blogger Theme by Blogger Designed and Optimized by Tipseo