Cara buat favicon

60

Cara buat favicon

Do you want to share?

Do you like this story?

Favicon adalah icon yang terdapat pada address bar atau tab bar pada web browser, cara buat favicon cukup mudah ingin membuatnya ikuti langkah berikut:

1. Buat gambar ukuran 32x32 simpan dengan format gif, jpg, png, dan bmp (pilih salah satu)
2. Kemudian buka http://tools.dynamicdrive.com/favicon/
3. Pada tombol browse pilih gambar yang telah dibuat
4. kemudian klik "create icon"
5. klik "download favicon" simpan gambar tersebut
6. simpan icon tersebut di alamat penyimpanan online bisa di www.geocities.com atau pages.google.com
7. langkah terakhir buka blogger lalu masuk ke edit HTML

cari code <head> kemudin paste kode dibawah ini dibawah kode <head>:

Catatan: warna merah ganti dengan alamat icon sesuai dengan nama alamat url tempat disimpannya icon

Contoh
<link href='http://www.geocities.com/oom_directory/favicon.ico' rel='shortcut icon'/>

8. simpan, kemudian lihat hasilnya.

60 komentar:

Dzofar mengatakan...: matur nuwun mas... it works!!! terimakasih banyak!!!; Selasa, Desember 11, 2007 8:54:00 PM
SatoNa mengatakan...: hmm.. kk.. bingung.. hehe..

aku dah tinggal dimasukin ke photobucket.. tapi dia ga trima dalam bentuk .ico .. gimana tuh? >_<

-SatoNa-; Sabtu, Desember 15, 2007 1:37:00 PM
SatoNa mengatakan...: waah kk.. dah berhasilll.. hehehe.. Akhirnya.. berhasil juga punya icon.. hehe..

thx bangeet yaah.. ^^; Sabtu, Desember 15, 2007 2:58:00 PM
Agus (o-om) mengatakan...: wah....udah berhasil selamat ya...; Sabtu, Desember 15, 2007 3:35:00 PM
VoLxaDa coMunitY mengatakan...: aDuh bOZzz,..keNApa buNYine
di photobucket.. g nrima dalam bentuk .ico .. gimana tuh? >_<
wadUH,..repLY y; Jumat, Maret 07, 2008 12:17:00 AM
Agus (o-om) mengatakan...: coba simpan disini saja www.geocities.com atau pages.google.com; Selasa, Maret 11, 2008 10:43:00 AM
opiniherry mengatakan...: Kok blon bisa yaa...; Sabtu, April 12, 2008 1:21:00 PM
Galih M. Jati mengatakan...: Wah keren nich om tutorialnya... thanks banget yach; Jumat, Mei 02, 2008 4:39:00 PM
Omni Master mengatakan...: d logo punya oom, di sekitar gambar bohlam ny kan transparan tuh...nah punya saya nggak tuh oom (msh ada white area ny)...gmn caranya bikin supaya bs transparan ya?; Sabtu, Mei 03, 2008 12:46:00 AM
OOM mengatakan...: @Omni Master : oh punya om tansparant dari imagenya langsung; Sabtu, Mei 03, 2008 6:52:00 PM
try risnandar mengatakan...: terima kasih banyak om; Jumat, Mei 09, 2008 3:58:00 PM
sRiE mengatakan...: Makasihh...
Blog sRiE udh ada faviconnya :); Sabtu, Mei 10, 2008 10:17:00 AM
OOM mengatakan...: makasih juga buat sri dan try :); Minggu, Mei 11, 2008 11:22:00 AM
indr@ mengatakan...: kerennnn tips-nya... walaupun favicon-ku sedikit katro hhhehehe...; Kamis, Mei 15, 2008 3:51:00 PM
F415 mengatakan...: TERIMA KASIH MAS AKU DAH COBAIN DAN BERHASIL.; Selasa, Mei 27, 2008 8:06:00 PM
Jaz mengatakan...: Kang kok punyaku keluar kata2 ini ya kang piye ki...?

Your template could not be parsed as it is not well-formed. Please make sure all XML elements are closed properly.
XML error message: The element type "link" must be terminated by the matching end-tag "".

Thanks Jaz.; Senin, Juni 09, 2008 12:04:00 AM
OOM mengatakan...: @jaz : jangan lupa di belang script di beri tanda garis miring '/>; Senin, Juni 09, 2008 4:37:00 PM
Abu Abeer mengatakan...: Assalamu'alaikum,
Jazakallah khair atas tips nya meski dg susah payah saya dapat juga mengganti favicon di blog saya.....sekali lagi Makasih; Kamis, Juni 19, 2008 7:02:00 AM
Nonaa Cindy mengatakan...: kok aku coba gak bisa yaa ? kalo pake imageshack.us bisa gak ?; Sabtu, Juni 21, 2008 3:06:00 PM
mbah joyo mengatakan...: makasih oom,langsung bisa nih mantapp....; Kamis, Juni 26, 2008 8:31:00 PM
Jazili mengatakan...: Kang klo untuk blogspot yang di domain sendiri kok gak bisa ya om...

Gimana ya caranya...
aku coba di www.jazili.com malah yang keluar iconnya google pages...

Bantu dong Om; Sabtu, Juli 05, 2008 4:18:00 PM
acy mengatakan...: halow om udah acy benerin kayaknya commentnya udah bisa dech, sekarang mo nyoba buat pavicon :); Jumat, Juli 25, 2008 1:35:00 PM
mujiholic mengatakan...: setelah diberitahu oleh kang firdaus, akhirnya aku menemukan tutorial ini juga, makasi kang firdaus ma kang O-Oms. tetep semangat Blogger Indonesia... !!!; Jumat, Juli 25, 2008 2:05:00 PM
OOM mengatakan...: @all : thanks buat komentarnya semoga sukses pasang faviconya :); Sabtu, Juli 26, 2008 12:04:00 AM
Nonenine mengatakan...: buat aku yang pemula ini banyak ngebantu ^^; Senin, Agustus 18, 2008 7:27:00 PM
Blog Gendeng mengatakan...: Belajar buat favicon n sukses,mas..mantap hehe..thx much; Sabtu, September 13, 2008 3:06:00 PM
Arif mengatakan...: bil nggu buka... jlan2 k rmahnya Om... biar smakin dpt ilmu bnyak...; Sabtu, September 13, 2008 5:38:00 PM
Agus Alfa mengatakan...: Mas, cara nyimpan iconya gmn?; Kamis, September 18, 2008 6:18:00 PM
inv0595m mengatakan...: udah saya coba kok tetap icon blogger ya yg muncul ?; Minggu, Oktober 05, 2008 5:51:00 PM
dina mengatakan...: simpan icon tersebut di alamat penyimpanan online bisa di www.geocities.com atau pages.google.com<<<<<< om cara simpannya gimana????masih binun Mode ON; Jumat, Oktober 24, 2008 8:37:00 AM
inzacky mengatakan...: mas skrng kok blogger ga bisa diganti yah faviconnya... nape neehh.... :(

Atow ada cara laen menyiasatinya... :>; Minggu, November 09, 2008 4:35:00 AM
Ruslan mengatakan...: sip....
oom emang tutornya simple tapi sangat berguna
dan mudah di aplikasi kan..

makasi y om

oom baik de...;)); Senin, Desember 01, 2008 11:17:00 AM
NOAH zZZzzzZZZz mengatakan...: kucoba deh; Kamis, Desember 18, 2008 5:04:00 AM
naufal mengatakan...: aku coba kok gk muncul di blogspot; Rabu, Desember 24, 2008 4:06:00 PM
Anonim mengatakan...: saya juga pengin buat ah....
lihat aja hasilnya di web baruku keren khan...
http://www.m4rnos.com; Kamis, Desember 25, 2008 10:17:00 PM
yusendobiz.blogspot.com mengatakan...: head
link href='http://www.geocities.com/p_rama_y/favicon.ico' rel='shortcut icon'/
b:include data='blog' name='all-head-content'/
title data:blog.pageTitle/ /title
b:skin ![CDATA[/*

koq gak kluar ya om? ada yg salahkah? please correct it ya..thanks
ps.tanda panah2 aku hilangin semua biar bisa post comment; Senin, Desember 29, 2008 11:43:00 PM
Aroby & Family Cyber mengatakan...: trims ya...ini berguna sekali....numpang copy paster ya...; Rabu, Januari 14, 2009 3:27:00 AM
maseadi mengatakan...: Ijin kopi buat post di blogku http://newsdigital.wordpress.com; Senin, Januari 26, 2009 2:59:00 PM
Komunitas Advance Jabar mengatakan...: Om gimana cara nyimpan download-an favicon di pages.google.com nya?; Rabu, Februari 11, 2009 1:02:00 PM
Fuad Malakian, SE mengatakan...: Dari langkah A sampai Z sudah berhasil, tp pas tak coba lihat hasilnya kok tetep ga berubah ya (masih icon blogger), kenapa ya oom? minta bantuannya!; Rabu, Maret 11, 2009 11:26:00 PM
Urang Diri mengatakan...: Punya saya kok belum bisa yach :
http://zuhadi.googlepages.com/Favikon.png; Minggu, Mei 17, 2009 3:16:00 PM
kwangkxz mengatakan...: saya sudah buat favicon yg animasi, tapi kenapa ya dia tidak bergerak ?
Terimakasih.; Selasa, Juni 02, 2009 7:16:00 PM
aan mengatakan...: mantab deeh om.. makasih y infonya :); Sabtu, Juli 04, 2009 9:33:00 PM
aan mengatakan...: klo buat wp gmn om caranya?; Sabtu, Juli 04, 2009 9:40:00 PM
yudha mengatakan...: aku pake punya yang gambar lampu punya mas aja deh..
dari tadi susah banget nimpen di geocities.com-nya..
makasih; Rabu, Juli 22, 2009 11:17:00 AM
elfangel elfilo mengatakan...: setelah surfing sekian lamanya akhirnya fil berhasil juga punya favicon... berkat artikelnya o-om dweh eang pastinya...
tanx eah om... ouh eah... fil juga buat link dweh.. ke artikel ini... buat artikelnya fil tentang favicon juga...
tapi beda kok om... cuman tambahan aja... alnya fil lihat... banyak eang tanya juga tentang favicon animasi... nah... fil cuman mau bagi-bagi ilmu ajah om... minta maaf om... karena artikelnya dibuat dulu baru minta ijin ama om...

buat temen2 eang pengen buat favicon animasi... maen2 dweh ke blogku... mindielfangel.blogspot.com ... khusus bat artikel favicon animasinya bisa dicopy paste aja urlnya http://mindielfangel.blogspot.com/2009/10/favicon-animasi.html

tanx banget om...; Minggu, Oktober 04, 2009 6:23:00 PM
ace_thirteenth mengatakan...: keren....
numpang sedot gan...; Rabu, Oktober 07, 2009 4:35:00 PM
citago (-_@) mengatakan...: sipppp; Minggu, Oktober 25, 2009 11:10:00 AM
anto mengatakan...: Disebagian template ada yang ga komfortibel. Saya sendiri pake cara seperti ini :saya taruh dibawah
]]></b:skin>

<link href='http://img412.imageshack.us/img412/3808/image11pc0.gif' rel='shortcut icon'/>

</head> dan berhasilhttp://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/5.gif; Minggu, November 29, 2009 1:11:00 AM
iplogodesign mengatakan...: wua, thx banget oom. sekarang web poe udah punya fav. mampir ya..; Senin, November 30, 2009 8:27:00 PM
Beni Raharjo mengatakan...: Terima kasih tipsnya.
Ssya juga gunakan http://www.html-kit.com/favicon untuk favicon animasi.; Jumat, Desember 25, 2009 9:38:00 AM
zakaria sunan ahmad mengatakan...: trimakasi
semoga berhasil jadi blogger yang handal
truzlah berkarya dan ajari aku tyk jadi blogger yg tdk rendah
;)); Selasa, Januari 12, 2010 12:35:00 PM
jun mengatakan...: coba ah ;)); Rabu, Maret 31, 2010 8:08:00 PM
gata mengatakan...: susahnya uplosd ico nya bos; Sabtu, April 24, 2010 4:28:00 PM
malinks mengatakan...: wah saya dah coba ne mas,tapi kok ngak tampil juga ya,masih pya om google juga yg tampil; Minggu, Mei 02, 2010 1:58:00 AM
http://www.fotoartis.in mengatakan...: coba dan langsung bisa . hehe :D
makasih mass infonya .; Sabtu, Mei 29, 2010 4:09:00 AM
Indonesian Sexy Artist Gallery mengatakan...: coba dan langsung bisa . hehe :D
makasih mass infonya .; Sabtu, Mei 29, 2010 4:09:00 AM
Aora TV mengatakan...: Ini yg di cari, eh di coba langsung bisa. Thanks :); Minggu, Juni 27, 2010 9:34:00 AM
FreyaLim.co.cc mengatakan...: Makasih. Udah dibuat.; Rabu, Juli 07, 2010 4:06:00 PM
Raden Teguh Bayu Nanda Basuki mengatakan...: thanks ya; Minggu, Agustus 08, 2010 2:32:00 PM