Monday, January 20, 2014

Membuat Favicon Animasi pada Blog

Bagaimana cara yang cepat membuat favicon animasi pada blog ? Pada Blog Berbagai Artikel Menarik ini, saya akan membagi artikel untuk Anda tentang "Membuat Favicon Animasi pada Blog".

Artikel ini, saya harap bisa membantu Anda untuk membuat favicon animasi pada Blog Anda. Untuk mengganti favicon bawaan dari blogger, tentu hal ini bukan merupakan bagian yang sulit bagi yang sudah lama bergelut dengan Blog.

Namun jika Anda tergolong Awam dengan Blog, Artikel ini akan menuntun Anda hingga Anda bisa membuat dan mengganti favicon pada Blog Anda sesuai dengan gambar yang Anda inginkan.
cara membuat favicon animasi pada blog
Apa yang dimaksud Favicon ? Favicon adalah gambar atau logo yang tampil pada bagian sebelah kiri dari halaman web yang ditampilkan pada tab berbagai jenis browser. Anda bisa melihat salah satu contoh favicon bawaan dari blogger yang ditampilkan pada tab browser google chrome, lihat pada gambar di bawah ini :
tampilan favicon animasi pada blog
Favicon tersebut di atas, Anda bisa ganti dengan gambar sesuai dengan yang Anda inginkan. Jika ingin mengganti favicon Blog Anda dengan gambar animasi, tentunya Anda memerlukan gambar animasi yang berdimensi atau berukuran 48 x 48. Setelah gambar-nya telah disiapkan, maka langkah selanjut-nya adalah mengupload gambar tersebut ke hosting.

Tujuan dari mengupload gambar yaitu agar Anda bisa mendapatkan url gambar. Url gambar tersebut diperlukan pada saat Anda akan mengedit html pada template blog anda.

Sebenarnya, cara membuat favicon pada blog bisa dilakukan dengan berbagai cara. Hanya saja, jika Anda mengganti favicon dengan cara mengedit template blog, hasilnya akan lebih cepat dibandingkan dengan cara yang lain. Ini dibuktikan pada web browser milik Mozilla. Begitu Anda selesai mengedit template pada bagian favicon, maka perubahan favicon pada blog anda akan langsung terlihat hasil-nya.

Melanjutkan pembahasan "Membuat Favicon Animasi pada Blog", langkah selanjutnya adalah bagaimana mengupload file gambar ke hosting ? Di sini akan saya jelaskan cara praktis mengupload gambar untuk mendapatkan url gambar. Cara praktis yang saya maksudkan adalah dengan menggunakan akun google.
  • Pertama-tama, silakan login pada akun google Anda. Setelah Anda login, maka akan muncul tampilan seperti pada gambar di bawah ini :
cara membuat favicon animasi pada blog-1
  • Klik sesuai dengan petunjuk pada gambar di atas, maka akan tampil gambar seperti di bawah ini :
cara membuat favicon animasi pada blog-2
  • Klik “Lainnya“ sesuai dengan petunjuk pada gambar di atas, maka akan dialihkan ke tampilan seperti pada gambar di bawah ini :
cara membuat favicon animasi pada blog-3
  • Klik “Foto“ seperti pada gambar di atas, maka selanjutnya akan tampil seperti pada gambar di bawah ini :
cara membuat favicon animasi pada blog-4
  • Klik “Upload foto“ seperti pada gambar di atas, maka akan tampil seperti pada gambar di bawah ini :
cara membuat favicon animasi pada blog-5
  • Klik pada bagian “Klik untuk membuka browser file“ seperti pada gambar di atas, maka akan dialihkan pada tampilan seperti pada gambar di bawah ini :
cara membuat favicon animasi pada blog-6
Selanjutnya, silakan Anda pilih pada drive mana gambar yang akan Anda upload untuk dijadikan sebagai gambar favicon pada Blog Anda. Lalu, silakan upload gambar tersebut jika telah menemukan pada drive mana Anda menyimpan gambar favicon tersebut.

Untuk mendapatkan url gambar dari gambar favicon yang telah Anda upload, silakan klik kanan pada gambar favicon yang telah diupload tersebut, kemudian Anda pilih  “Copy Image Location“. Selanjutnya, pastekan pada aplikasi word atau notepad.

Pada tahap ini, Anda telah memiliki url gambar yang akan Anda jadikan sebagai gambar favicon pada Blog Anda.

Tahap berikutnya adalah mengganti favicon pada Blog Anda dengan gambar favicon yang anda telah upload tadi. Cara tersebut adalah sebagai berikut :
  • Login pada akun Blog anda. 
  • Pilih “Template“, lalu pilh “Edit template“. 
  • Cari tulisan atau kode seperti ini : ]]></b:skin> pada template Blog Anda. 
  • Setelah Anda menemukan kode di atas, silakan masukkan kode di bawah ini tepat di bawah kode ]]></b:skin> 
Kode tersebut adalah : 
<link href='https://lh5.googleusercontent.com/-OzOYtM4tlj8/UtD_pi_-XEI/AAAAAAAAAC /IU4_jZRJBtE/s48-no/Favicon+Tips+dan+Trik..gif' rel='shortcut icon' type='image/vnd.microsoft.icon'/>
  • Ganti tulisan yang berwarna merah pada kode di atas dengan url gambar favicon Anda (url yang Anda pastekan pada aplikasi word atau notepad tadi).
  • Klik “Simpan template“ untuk menerapkan perubahan pada template Blog Anda.
Jika semua berjalan dengan baik, maka Anda akan melihat perubahan gambar favicon pada Blog Anda.

Demikianlah Artikel tentang "Membuat Favicon Animasi pada Blog", yang saya publikasikan pada Blog Berbagai Artikel Menarik. Semoga Artikel ini menarik dan  bermanfaat untuk Anda.

Baca juga :
    Berbagai Artikel Menarik
    Share this article to your friends :

    0 comments:

    Post a Comment