Favicon adalah semacam icon yang akan muncul di address bar atau tab bar jikalau kita mengetikkan alamat blog/website kita. Untuk lebih jelasnya silahkan melihat gambar berikut ini.

Gambar di atas adalah gambar default favicon-nya Blogger. Tentunya kita ingin blog kita menjadi lebih personal dan unik sehingga lain dari yang lain. Salah satu caranya adalah dengan mengganti gambar favicon default blogger dengan gambar favicon anda sendiri. Caranya cukup mudah kok, yaitu:
Gambar di atas adalah gambar default favicon-nya Blogger. Tentunya kita ingin blog kita menjadi lebih personal dan unik sehingga lain dari yang lain. Salah satu caranya adalah dengan mengganti gambar favicon default blogger dengan gambar favicon anda sendiri. Caranya cukup mudah kok, yaitu:
1. Buat atau sediakan gambar atau favicon anda, sebaiknya gambar/icon yang akan anda gunakan untuk membuat favicon berukuran 16x16 pixel, tidak kurang dan tidak lebih agar hasilnya lebih maksimal. Format gambar untuk membuat favicon bisa .PNG, .GIF, .JPEG.
2. Upload gambar anda tersebut melalui form "post" di dashboard dengan meng-click simbol "add image" berikut ini (klik simbol yang dilingkari lingkaran merah).

3. Jangan Publish post tesebut, cukup klik "SAVE NOW" saja.
4. Lalu click "Edit HTML" pada post yang anda SAVE tadi (lihat gambar, klik untuk memperbesar).

Dan jangan lupa copy dan paste kode seperti yang diblock pada gambar di atas di aplikasi text seperti Notepad. Kode tersebut mungkin berbeda dengan milik anda, yang penting copy dan paste kode yang memuat nama file gambar favicon anda pada baris-baris terakhir. Lalu SAVE.
5. Setelah itu, klik menu "LAYOUT" trus pilih "Edit HTML" jangan lupa kasih tanda checklist pada "Expand Widget Template". (Klik gambar agar lebih jelas)

6. Cari kode <head> dan <b:include data='blog' name='all-head-content'/>
7. Lalu letakkan kode berikut ini di antara kedua kode tadi, jangan lupa ganti "URLDISINI" dengan kode yang sudah anda copy-paste-kan ke Notepad tadi
<link href='URLDISINI' rel='icon' type='image/vnd.microsoft.icon'/>
Lalu klik SAVE TEMPLATE.
8. Cobalah untuk mengetikkan URL blog atau website anda di browser. Bila favicon milik anda belum muncul, silahkan ikuti petunjuk berikut:
8.a. Silahkan kembali ke DASHBOARD lalu pilih menu "Layout"-"Edit HTML"-checklist pada "Expand Widget Templates"
8.b. Cari kode <b:skin> lalu letakkan kode <link href='URLDISINI' rel='icon' type='image/vnd.microsoft.icon'/> tepat di atasnya. Jangan lupa ganti "URLDISINI" dengan kode yang sudah anda copy-paste-kan ke Notepad tadi. Dan klik SAVE TEMPLATE.
9. Seharusnya Favicon anda sudah muncul, jika belum silahkan ber-YM-an dengan saya saat saya online atau meninggalkan pesan di kolom komentar di bawah ini. Selamat Blogging....
2. Upload gambar anda tersebut melalui form "post" di dashboard dengan meng-click simbol "add image" berikut ini (klik simbol yang dilingkari lingkaran merah).
3. Jangan Publish post tesebut, cukup klik "SAVE NOW" saja.
4. Lalu click "Edit HTML" pada post yang anda SAVE tadi (lihat gambar, klik untuk memperbesar).
Dan jangan lupa copy dan paste kode seperti yang diblock pada gambar di atas di aplikasi text seperti Notepad. Kode tersebut mungkin berbeda dengan milik anda, yang penting copy dan paste kode yang memuat nama file gambar favicon anda pada baris-baris terakhir. Lalu SAVE.
5. Setelah itu, klik menu "LAYOUT" trus pilih "Edit HTML" jangan lupa kasih tanda checklist pada "Expand Widget Template". (Klik gambar agar lebih jelas)
6. Cari kode <head> dan <b:include data='blog' name='all-head-content'/>
7. Lalu letakkan kode berikut ini di antara kedua kode tadi, jangan lupa ganti "URLDISINI" dengan kode yang sudah anda copy-paste-kan ke Notepad tadi
<link href='URLDISINI' rel='icon' type='image/vnd.microsoft.icon'/>
Lalu klik SAVE TEMPLATE.
8. Cobalah untuk mengetikkan URL blog atau website anda di browser. Bila favicon milik anda belum muncul, silahkan ikuti petunjuk berikut:
8.a. Silahkan kembali ke DASHBOARD lalu pilih menu "Layout"-"Edit HTML"-checklist pada "Expand Widget Templates"
8.b. Cari kode <b:skin> lalu letakkan kode <link href='URLDISINI' rel='icon' type='image/vnd.microsoft.icon'/> tepat di atasnya. Jangan lupa ganti "URLDISINI" dengan kode yang sudah anda copy-paste-kan ke Notepad tadi. Dan klik SAVE TEMPLATE.
9. Seharusnya Favicon anda sudah muncul, jika belum silahkan ber-YM-an dengan saya saat saya online atau meninggalkan pesan di kolom komentar di bawah ini. Selamat Blogging....

27 komentar:
Info bagus bos, matur nuwun...
NICE INPO GAN!
Saya pernah coba bikin pavicon....tapi ko' bisa ilang ya'...
Ok...saya coba tips yang ini, mudah-mudahan berhasil nih..
Thank's infonya Taufik...
kalo wordpress ada yg kaya gituan ngga???
Kalo di wordpress keknya lebih simpel kok
duh, pengen banget bisa ngganti favicon blogku. tapi internet lelet gini nggak bisa bebas bereksperimen.
anyway, makasih banyak tipsnya, fik. ntar kucoba kalau memungkinkan.
@katax: sami-sami
@orangapatiang: thanks
@Yopan Prihadi: Dicoba ya Pak?
@dion: Bukannya wordpress tinggal ngupload gambarnya aja?
@JAUHDIMATA: yup, bener tuh.
@Marshmallow: dicoba ya Mbak?
keren bro gua udah coba and sukses, silahkan check di www.dedy21.com
makasih atas infonya :)
thanks atas tips paviconnya. udah bisa bro.
makasi infox ya mas
keren bos
thankz infonya.. :)
www.irma-blog.co.cc
thanks buat infonya
infonya bagus banget gan dah saya coba pada website saya lo... he he http://www.pendopokoeshendratmo.com
kasiat-jambu.blogspot.com:ab:
Duh... rasanya sampe cuape deh, semua petunjuk dah dikerjain...tapi koq ga bisa-bisa yah...
tolong donk ...kira-kira salahnya dimana yach.....??
di IE belum bisa bos, tapi di firefox, opera, crome dah oke,, tu masalah nya apa? :ad:
terima kasih atas trik nya. skrg blog saya jadi lebih personal.
visit here:
gamesiklopedia.blogspot.com
mantap gan..
dah berjam utak-atik gk bs2..
dah berpuluh2 artikel d coba gk bs2 jg..
eh akhirnya bisa juga..
pke cra yg pertama gk bs, eh tp pke cr ygke 2 akhirnya bisa juga....
hohoho
makasih inponya
makasih mas....it's workin' hihi senengnya..pake cara yang pertama pula :) salam kenal mas
thank yu bro buat caranya... :)
omong opo kuwiiii omong opo omongopo
^_^ omongopo omongopo www.abdur-rozak.co.tv
Nice info sob, saya coba trik ini.
nice share keep posting gan ............
terima kasih bos akhirnya blog saya bisa di ganti faviconnya setelah sekian lama mencoba dan mencaba...saluuutttt
Post a Comment