Membuat dan Mengganti Favicon Blogger

Membuat dan Mengganti Favicon Blogger

Sudah tahu yang namanya favicon? Kalau belum, favicon adalah ikon kecil yang muncul di pojok kiri address bar dan pojok kiri tab. Secara default favicon blog berbasis Blogger/Blogspot adalah simbol B dengan background jingga. Tentunya anda ingin punya favicon sendiri untuk branding blog anda kan? Bagaimana cara membuat favicon yang gampang, lalu menampilkannya di blog? Ikuti langkah-langkahnya.

Pertama anda harus punya gambaran untuk favicon. Bagi Anda yang menguasai software grafis, Anda boleh membuat sebuah logo dengan Adobe Photoshop, Illustrator, CorelDraw, atau software grafis apapun yang Anda kuasai. Lalu ekspor ke gif, png atau jpg. Jika Anda tidak menguasai software grafis, anda bisa gunakan icon gratis dengan googling atau bahkan foto yang ada di harddisk anda.

Lalu upload file tersebut ke website Favicon from Pics dengan menekan Browse. Contreng pilihan "Animate Favicon" jika anda menginginkan favicon animasi. Lalu klik "Generate Favicon.ico".

 
Selanjutnya download favicon yang dihasilkan dengan mengklik tombol "Download Favicon".

 

Extract file zip yang dihasilkan. Lalu upload favicon.ico dan animated_favicon1.gif (favicon animasi) ke file hosting gratis seperti Google Pages, Photobucket.

Sekarang, login ke Blogger. Pilih Layout -> Edit HTML.

Copy kode di bawah ini:

<link rel="shortcut icon" href="favicon.ico" />
<link rel="icon" href="animated_favicon1.gif" type="image/gif" />

Lalu paste persis di bawah baris kode berikut:

<b:include data="blog" name="all-head-content"/>

Sekarang ubah alamat URL favicon dengan URL tempat anda menyimpan file favicon di file hosting. Lihat gambar di atas, klik untuk melihat lebih besar. Perhatikan, bagian yang dihighlight adalah contoh URL yang telah diubah. Ubah juga alamat URL favicon animasi (animated_favicon1.gif) jika anda memang menginginkannya. Periksa lagi apakah alamat URL sudah benar.

Simpan Template. Lihat hasilnya. Jika favicon belum muncul, refresh browser.

Salam Senyum Sukses …!!! <3S>