Selasa, 29 Desember 2009

Cara mengganti logo blogspot - mengganti favicon blogger

75 komentar

Blogger.com (blogspot.com) memberikan kebebasan kepada para bloggernya untuk mengubah faviconnya masing-masing. Lihat perbandingan dua gambar berikut.

Yang sebelah kiri adalah favicon default di blogspot dan yang sebelah kanan adalah favicon modifikasiku. Bikinnya gampang kok. Saya akan tunjukkan kepada anda sekalian bagaimana mengganti favicon blogspot:
  1. Persiapkan gambar untuk favicon. Anda bisa menggunakan editor gambar kesukaan untuk berkreasi. Saya menggunakan Adobe Photoshop.
  2. Ukuran icon yang saya buat adalah 27 x 20 pixel. Menurut saya ukuran maksimal untuk tinggi icon agar terlihat proporsional adalah 30 pixel.
  3. Simpan dengan ekstensi gif (File, Save As, File Type : gif). Ekstensi untuk favicon sebenarnya bisa dibuat dalam ekstensi gif, ico dan png. Saya pilih gif karena lebih mudah pembuatannya dan ukurannya relatif kecil, juga bisa dibuat beranimasi (tidak saya bahas sekarang)
  4. Upload gambar ke ImageShack, Flickr atau dari Picasa dan dapatkan link direct downloadnya. Contoh yang saya pakai ada di https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjN6UTjlUgnhtoZ8h_HA75pwIjuzvmDXSoIrELEcztSXtcqdxmjKPlq2xi79U9kgI-AAHtfwO73V_Zh0Ey0S8kp_llcyeEHPY62CCE1_ooD2HPxz3tSweBqHj35bx8a5WjTRA42c-OuwBU-/s512/icon3c.gif

    Updated - 23 Mei 2011 : Anda dapat mengupload file favicon ke
    1. http://www.iconj.com/favicon_hosting.php
    2. http://www.picpanda.com
    3. http://www.fileden.com
    4. http://mirrorimg.net
    5. http://www.imageboo.com
  5. Login ke Dashboard blogspot anda, masuk ke menu Layout, Edit HTML
  6. Tekan CTRL+F, masukkan kata: </head>, letakkan kursor anda sebelum tanda </head> tersebut
  7. Selipkan syntax berikut :
    <link href='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjN6UTjlUgnhtoZ8h_HA75pwIjuzvmDXSoIrELEcztSXtcqdxmjKPlq2xi79U9kgI-AAHtfwO73V_Zh0Ey0S8kp_llcyeEHPY62CCE1_ooD2HPxz3tSweBqHj35bx8a5WjTRA42c-OuwBU-/s512/icon3c.gif' rel='shortcut icon'/> (NB: Ganti alamat https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjN6UTjlUgnhtoZ8h_HA75pwIjuzvmDXSoIrELEcztSXtcqdxmjKPlq2xi79U9kgI-AAHtfwO73V_Zh0Ey0S8kp_llcyeEHPY62CCE1_ooD2HPxz3tSweBqHj35bx8a5WjTRA42c-OuwBU-/s512/icon3c.gif sesuai alamat icon anda di ImageShack)
  8. Save Template dan lihat perubahan yang terjadi (View Blog) - Selesai
Silahkan dicoba. Beri tahu saya hasil yang anda buat.

--------------------- Update (10 Feb 2010) --------------------
Untuk memaksa browser menampilkan favicon diatas, anda dapat menambahkan kode:
<link href='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjN6UTjlUgnhtoZ8h_HA75pwIjuzvmDXSoIrELEcztSXtcqdxmjKPlq2xi79U9kgI-AAHtfwO73V_Zh0Ey0S8kp_llcyeEHPY62CCE1_ooD2HPxz3tSweBqHj35bx8a5WjTRA42c-OuwBU-/s512/icon3c.gif' type='image/gif' rel='icon' />
Tepat dibawah kode point no. 7.

Favicon dengan tipe file gif bisa muncul dengan baik di browser firefox, namun tidak tampak di IE. Untuk memastikan setiap icon muncul dengan konsisten, tipe file harus .ico. Silahkan kunjungi http://www.html-kit.com/favicon/ untuk membuat file .ico gratis!
Semoga bermanfaat.

Ingin cara yang lebih mudah lagi? baca disini

Penyedia Jasa Pembuatan Website, Blog, Aplikasi berbasis Web - Murah dan Bergaransi Seumur Hidup

Categories: , , ,

75 komentar:

  1. Gilang Spunkiness28 Januari 2010 pukul 22.59

    bagussss...........!!!!!!!!!!!!!

    BalasHapus
  2. Gilang Spunkiness29 Januari 2010 pukul 08.47

    bagussss...........!!!!!!!!!!!!!

    BalasHapus
  3. Bang Hery29 Januari 2010 pukul 09.09

    Terima kasih Mas Gilang :)

    BalasHapus
  4. akirawisnu28 Februari 2010 pukul 12.40

    Keren bang heri...
    saya suka :D
    hehehehe

    btw blogwalking k tmpt ane ya gan :D

    BalasHapus
  5. Bang Hery28 Februari 2010 pukul 14.25

    terima kasih akirawisnu.

    saya seneng2 aja blogwalking ke tempat akirawisnu, tapi alamatnya mana ya?

    BalasHapus
  6. akirawisnu2 Maret 2010 pukul 00.48

    wah!! bang hery

    ini linknya : http://akirawisnu.blogspot.com/

    makasii buat inponya loh gan :D, ud saia coba dan SUKSES :D

    makaisi yaaa.. :D

    BalasHapus
  7. sonic4224 Maret 2010 pukul 14.57

    bang hery,, upload file ico kmana y??? saya sudaha coba pke jpg dan berhasil, namun beberapa browser g mw tmpil

    BalasHapus
  8. Bang Hery24 Maret 2010 pukul 14.58

    sonic42, upload file ico atau jpg diarahkan ke server yang mendukung akses publik seperti imageshack, picasa atau flickr.

    File favicon berformat jpg atau gif memang terlihat muncul di firefox namun dalam beberapa kasus tidak kelihatan di IE dan chrome. Jadi memang langkah amannya adalah menggunakan file format ico

    BalasHapus
  9. Fikri Kautsar14 Mei 2010 pukul 23.49

    Makasih gan, sangat membantu....

    BalasHapus
  10. Bang Hery15 Mei 2010 pukul 09.05

    sama2 agan fikri..

    BalasHapus
  11. drhyudi19 Mei 2010 pukul 14.10

    berkali-kali nyoba tetap gak bisa...untung ktemu bloghery info, favicon saya sudah bisa muncul. thanks tipsnya.

    BalasHapus
  12. Bang Hery19 Mei 2010 pukul 14.24

    selamat drhyudi, senang bisa membantu anda..
    btw dimana alamat blog anda, saya juga ingin lihat kalo dibolehkan ;)

    BalasHapus
  13. alfan16 Juni 2010 pukul 06.45

    wah, terimakasih Om. sedikit menantang mengenai ekstensi file, hehehe, salam kenal ya, dari barala go blog. masih Balita Om.

    BalasHapus
  14. Bang Hery16 Juni 2010 pukul 09.22

    Salam kenal kembali mas alfan. Senang bisa membantu :)

    BalasHapus
  15. Wwxnraf23 Juli 2010 pukul 03.01

    thank's mas alfan, sdh di coba siiiiiplah...

    BalasHapus
  16. Bang Hery23 Juli 2010 pukul 09.48

    hehehe.. nama saya hery, mas... bukan alfan :)

    BalasHapus
  17. Adh3nk29 Juli 2010 pukul 12.58

    mantab bg.... :)

    BalasHapus
  18. borneo31314 Agustus 2010 pukul 13.55

    thanks gan infox.....

    BalasHapus
  19. tastha24 Agustus 2010 pukul 23.51

    nuhun pisan ahh.. :)
    tukeran link yu?? he
    http://informasiterhangat.blogspot.com

    BalasHapus
  20. Andi outSIDeR31 Oktober 2010 pukul 17.30

    Thank'z brother . . .
    Kunjungi yawh . . . http://downloadsoftwarebro.com

    BalasHapus
  21. Zacky20 November 2010 pukul 13.02

    Nuhun Pisan cuy
    (makasih Banyak ya)

    BalasHapus
  22. Bang Hery20 November 2010 pukul 13.12

    terima kasih kembali ;)

    BalasHapus
  23. fadli28 November 2010 pukul 18.28

    makasih gan. inponya berguna banet, kebetulan w lg nyari yang ginian

    BalasHapus
  24. Audhika22 Desember 2010 pukul 22.16

    waduh keren abis artikelnya jelas dan padat dan mudah di mengerti. saya sudah mencobanya tpi tidak terlihat di google chrome. mungkin sudah ke ganti. thank you postingnya

    BalasHapus
  25. Ary Surya P W4 Januari 2011 pukul 18.22

    Terima Kasih infonya. sudah saya coba dan berhasil.
    http://partalearning.blogspot.com/

    BalasHapus
  26. Educyber176 Januari 2011 pukul 16.55

    bang hery q udh coba,,
    sma smua udah langkahY tp ga bisa2 knpa ya..

    BalasHapus
  27. Adimput10 Januari 2011 pukul 20.32

    Ok Thank.... langsung praktek...

    BalasHapus
  28. Xspeedboy11 Januari 2011 pukul 18.28

    joz bang... http://xspeedboy.blogspot.com

    BalasHapus
  29. Bang Hery13 Januari 2011 pukul 17.21

    selamat bung Xspeedboy

    BalasHapus
  30. Bang Hery6 Februari 2011 pukul 22.06

    coba ikuti langkah2 diatas secara teliti - soalnya aku lihat kode untuk menampilkan favicon (langkah ke-7) tidak terdapat di dalam kode HTML blog anda

    BalasHapus
  31. William Saturn PS7 Februari 2011 pukul 18.37

    bang, yang ditulis Link, Direct Link, wigdet code, forum code, HTML code , Alt forum Kode.

    BalasHapus
  32. Iil_humm_1314 Februari 2011 pukul 20.16

    bisa minta tolong di printscreen ga hasil nya ??

    BalasHapus
  33. Nieaabcde19 Februari 2011 pukul 13.54

    Makasi bang :)

    BalasHapus
  34. Wahyu_leoboys20 Februari 2011 pukul 06.22

    thanks bro.........salam kenal http://www.komputertutorial.com/

    BalasHapus
  35. Bang Hery20 Februari 2011 pukul 09.33

    salam kenal juga bro :)

    BalasHapus
  36. Renaldin28 Februari 2011 pukul 13.10

    thx ya bro . . .

    BalasHapus
  37. Bang Hery5 Maret 2011 pukul 11.14

    selamat gan :)

    BalasHapus
  38. surya54625 Maret 2011 pukul 19.57

    Aku tertarik cara membuat ini dan langsung action ya

    BalasHapus
  39. rian2 April 2011 pukul 18.36

    bagusssssssssssss

    BalasHapus
  40. Alladina Hapsery19 April 2011 pukul 06.31

    thanks bro.. :)

    BalasHapus
  41. ryu kenmeina23 April 2011 pukul 09.36

    saya uwd nyoba instruksiny
    tp kok g bs..???

    BalasHapus
  42. Bang Hery23 April 2011 pukul 11.32

    bung ryu hanya kurang beruntung. Coba lebih teliti mengikuti langkah-langkah ini. Sudah banyak yang berhasil kok :)

    BalasHapus
  43. dedi dermawan28 April 2011 pukul 22.58

    follow blog wa dong...^_^
    http://poncolgate.blogspot.com

    BalasHapus
  44. MurahCertain4 Mei 2011 pukul 11.47

    semangat... saya sudah berhasil bang http://murahcertain.blogspot.com/

    BalasHapus
  45. Bang Hery4 Mei 2011 pukul 12.33

    selamat bro, salam kenal ;)

    BalasHapus
  46. ayatulhusnarahmafamira15 Mei 2011 pukul 00.47

    makasih bro.....

    BalasHapus
  47. www.gpulsa.net24 Mei 2011 pukul 02.30

    thank bung

    BalasHapus
  48. Altair ibn Abdi Robhani1 Juni 2011 pukul 22.44

     Trimakasih buat infonya:)
    Sungguh bermanfaat, akan saya coba.

    Btw, blognya udah sya follow
    Kami tunggu Follbacknya....

    Salam spirit dari Dayat's Artikel

    BalasHapus
  49. Bang Hery1 Juni 2011 pukul 23.39

    sudah di follow, trims

    BalasHapus
  50. www.kolom-opini.co.cc4 Juni 2011 pukul 14.34

    n..nice info..Sudah sukses ane taro di TKP...Klo sempat mampir ke TKP gan..udah ane siapin karpet merah buat agan..

    BalasHapus
  51. Bang Hery4 Juni 2011 pukul 20.41

    mantap gan, sudah kunjungan balik :)

    BalasHapus
  52. Ilam Brank13 Juni 2011 pukul 22.32

    maksih y bg ....  :)

    BalasHapus
  53. Bang Hery14 Juni 2011 pukul 10.21

    Sama-sama bro :D

    BalasHapus
  54. Jerry Gerungan20 Juni 2011 pukul 21.04

    Makasih infonya kk Herry

    BalasHapus
  55. Jeremy17 Juli 2011 pukul 17.13

    visit my blog
    jimz-blogs.blogspot.com

    BalasHapus
  56. ZIEYA_OCKTARIANI14 Juli 2011 pukul 07.55

    kok g bisa
    udh berapa kali pi g KTIFF bbm AKU
    :(

    BalasHapus
  57. Racheldewa15 Juli 2011 pukul 20.52

    lumayan susah

    BalasHapus
  58. Ronyjugul18 September 2011 pukul 00.28

    thanks gan.... favicon muncul dengan sempurna :))
    kunjungi blog saya ya
    http://mengapatakmencoba.blogspot.com

    BalasHapus
  59. Muslimkodachi28 Oktober 2011 pukul 14.09

    thanks gan atas info x

    BalasHapus
  60. Soniazen9527 November 2011 pukul 11.18

    makasih gan..

    BalasHapus
  61. Zieteru16 Januari 2012 pukul 09.50

    ikutan naroh link ya

    http://zieteru.blogspot.com/ 

    BalasHapus
  62. deppyna12 Maret 2012 pukul 09.58

    makasih mas informasinya....
    sangat2 bermanfaat!!!!!!

    BalasHapus
  63. Hendrik Tok4 Mei 2012 pukul 21.01

    Kak, kok saya gak bisa ya ?

    ini blog saya Hendriktok.blogspot.com

    BalasHapus
  64. Bang Hery4 Mei 2012 pukul 22.16

     sudah sukses kok, coba dibersihin dulu cache browsernya :)

    selamat ya

    BalasHapus
  65. Sultanzaky7720 Juni 2012 pukul 14.47

    thank gan infonya....

    BalasHapus
  66. Rizaluye4328 Juni 2012 pukul 15.37

    cara dapet 
    link direct downloadnya gmn mas

    BalasHapus
  67. Widyawatishmkn11 Juli 2012 pukul 12.09

    siiippppp........
    thankz

    BalasHapus
  68. Ifannoy31 Agustus 2012 pukul 14.48

    gan mnta tutorialNya buat bikin itu tu. yang ada burung muter-muter di halaman plisss. tolong bgt gan <<<<

    BalasHapus
  69. Andri-OP13 Oktober 2012 pukul 14.46

    Mantab brow, terima kasih banyak...

    BalasHapus
  70. Bima Arsa17 Oktober 2012 pukul 20.33

    bang saya masih bingun , boleh minta nomor hpnya ga ?? sms aja ke 089654262717

    BalasHapus
  71. luqman8 Januari 2013 pukul 18.48

    makasih mas...sukses sya coba
    http://sayadankaligrafi.blogspot.com/

    BalasHapus
  72. luqman8 Januari 2013 pukul 18.52

    kursor arahkan ke gambar -> klik kanan plih copy image location -> paste di tmpt pnyimpnan word/document...

    BalasHapus
  73. Adhitya_pratama9 Januari 2013 pukul 17.44

    thx infonya visit http://realeffingdeal-ind.blogspot.com/

    BalasHapus
  74. Bang Hery17 Januari 2013 pukul 01.24

     sama2 ya :)

    BalasHapus
  75. Bang Hery17 Januari 2013 pukul 01.25

     hihihi, udah lupa :p

    BalasHapus

Komentar Anda..?

Langganan: Posting Komentar (Atom)
Related Posts Plugin for WordPress, Blogger...
Langganan RSS Feed Follow me on Twitter!