Ganti Ikon Favicon pada Blogspot
Oleh Victor | May. 12, 2009 | Blogging, Tutorial & Trik Blogspot
Sebenernya saya sendiri juga kurang begitu jelas apa istilahnya apakah itu benar Favicon. Tapi yang jelas yang saya maskud disini adalah icon yang ada di samping alamat url pada browser (baik itu Firefox, IE, dan teman-temannya). Untuk blog yang menggunakan Blogspot, sudah jelas ikonnya pasti logo Blogspot (huruf B) berwarna putih dengan kotak berwarna oranye.

Bisakah kita mengganti ikon tersebut sesuai dengan keinginan kita? Jawabannya bisa, dan relatif mudah caranya. Dalam tulisan berikut saya akan membahas secara singkat, cara mengganti ikon tersebut, sekaligus untuk melengkapi trik-trik seputar Blogspot lainnya seperti menyembunyikan Navbar, membuat Read More, Recent Comment, dan Recent Post.
Langkah pertama, yang harus kita lakukan adalah membuat ikon itu sendiri, buat image dengan ukuran 16×16 pixel (bisa menggunakan Photoshop atau program pengolah gambar lainnya. Simpan file tersebut dengan format .png.
Selanjutnya kita masuk ke kontrol panel Blogspot, dan buat posting baru, hanya saja untuk posting di sini, kita hanya melakukan upload image yang telah kita buat sebelumnya.

Setelah image masuk, sekarang kita masuk tab Edit Html, untuk mengambil (mengcopy) alamat url dari image yang telah kita upload tadi (url image ada setelah kata src=), dalam contoh image tersimpan di alamat http://2.bp.blogspot.com/_HEJWTRbFQg4/Sgkf-Gue3GI/AAAAAAAAADg/imlhJrYZ_7s/s400/favicon.png. Jika sudah dicopy, maka simpan posting-an tersebut sebagai draft (ingat jangan dipublish).

Langkah berikutnya, masuk ke tab Layout dan Edit Html, centang Expand Widget Templates.

Cari tag </b: skin><[CDATA[, kemudian masukan script berikut di atasnya. Ganti alamat-url-ikon.png dengan url yang telah kita copy tadi.
<link href='http://alamat-url-ikon.png' rel='shortcut icon'/> <link href='http://alamat-url-ikon.png' rel='icon'/>
Contoh:
<link href='http:// 2.bp.blogspot.com/_HEJWTRbFQg4/Sgkf-Gue3GI/AAAAAAAAADg/imlhJrYZ_7s/s400/favicon.png ' rel='shortcut icon'/> <link href='http:// 2.bp.blogspot.com/_HEJWTRbFQg4/Sgkf-Gue3GI/AAAAAAAAADg/imlhJrYZ_7s/s400/favicon.png ' rel='icon'/>

Setelah selesai, kita simpan template tersebut dan selesai. Sekarang bisa kita coba buka alamat blog yang kita rubah ikon Favicon-nya. Jika berhasil maka sekarang favicon sudah berubah sesuai dengan image yang kita buat dan upload tadi.

Cukup mudah kan caranya, oke selamat mencoba.







December 5th, 2009 at 16:30
Sip… berhasil…. thx
December 7th, 2009 at 10:22
Thanks ilmunya
December 19th, 2009 at 10:08
thanks Om, langsung tak paraktekan langsung OK
May 19th, 2010 at 12:33
gak bisa tuh bos, skrip diatas gak ada, yang ada
<![CDATA[/*
udah saya pasang diatasnya tapi logo kok masih tetap gak berubah. apanya yang salah?
June 26th, 2010 at 23:13
berhasil
mantab
makasi yaa
October 5th, 2010 at 15:51
berhasil om thanks yh :D
October 27th, 2010 at 13:39
kok gak bisa ya?
February 7th, 2011 at 14:44
gx bisa bozz……
link_Y gx ada…????
April 25th, 2011 at 14:57
tank’s
August 25th, 2011 at 17:30
keren banget…makasi