Cara menambahkan animasi cursor di blog wordpress Bergerak mengikuti kursor unik dan keren - Untuk anda yang saat ini ingin mendesain dan ingin menambah tampilan blog maupun wordpress anda menjadi lebih menarik unik dan keren , kali ini saya telah membuat tutorial yang mungkin dapat bermanfaat bagi anda yakni Cara menambahkan animasi cursor di blog wordpress Bergerak mengikuti kursor unik dan keren yang dapat anda baca selengkapnya dibawah ini :
Caranya sangat mudah, sobat bisa mencarinya lewat search engine yang ada di sebelah kanan atas blog ini. Tuliskan keyword yang berhubungan, misal : Cursor animation, Free 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 blogger sendiri juga bisa. Untuk cara-cara mengupload gambar sudah saya terangkan, silahkan baca kembali di sini apabila sobat masih belum bingung mengenai cara upload gambar. Apabila gambar animasi sudah si upload, catat alamat gambar tersebut. Sebagai contoh, saya mempunyai gambar cursor berbentuk naga terbang dengan alamat sebagai berikut :
http://24rohman.googlepages.com/dragon3.ani
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://24rohman.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
Sign in di blogger.
Klik menu Template
Klik menu Edit HTML
Copy seluruh kode template yang ada, lalu save untuk backup data
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;
}
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://24rohman.googlepages.com/dragon3.ani”);
}
Klik tombol Simpan Perubahan Template
Selesai. Silahkan lihat hasilnya.
Untuk template baru
Sign in di blogger
Klik menu Layout
Klik menu Edit HTML
Klik link Download template seluruhnya, save dulu untuk backup biar aman
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;
}
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://24rohman.googlepages.com/dragon3.ani”);
}
Klik tombol Simpan Template
Selesai. Silahkan lihat hasilnya.
