Menambahkan Favicon di Blog

Favicon? Makhluk apa itu?  (thinking)

Buat yang belum tahu, Favicon adalah ikon yang muncul di bagian address atau title bar browser, persis di sebelah kiri alamat URL atau judul situs.

Hampir pasti setiap browser akan menampilkan favicon ini. Kalau kamu tidak menambahkan favicon sendiri, yang ditampilkan pada browser adalah ikon default yang tentu biasa-biasa saja.

Kalau ingin browser menampilkan favicon yang khas, ya tentu harus bikin sendiri. Trus bagaimana caranya menambahkan favicon di blog?

Yang pertama jelas kamu harus punya ikon. Ukuran yang disarankan adalah 16×16 pixel. Ada banyak situs yang bisa membantu pembuatan ikon ini. Googling aja pake kata kunci “create favicon” atau “favicon generator”. Salah satunya adalah favicon.cc.

Ikon bisa “digambar” sendiri atau mengambil dari foto/gambar yang sudah ada. Sangat disarankan untuk menyimpan ikon dalam format ICO.

Setelah jadi, upload ikon tersebut ke folder public_html blog atau situsmu. Berikutnya, sunting bagian header HTML dengan menambahkan tag berikut:

<link rel="shortcut icon" href="http://myblog.com/myicon.ico" />
<link rel="icon" href="http://myblog.com/myicon.ico" type="image/x-icon" />

Gantilah nama domain dan nama file ICO sesuai dengan nama domain dan file ICO buatanmu.

Untuk pengguna WordPress (self-hosted), penyuntingan bagian header bisa dilakukan dengan masuk ke menu Appearance > Editor lalu pilih header. Pastikan tag di atas terletak di dalam tag <head>.

Simpan perubahan tersebut dan panggil kembali blog/situsmu dengan browser. Naaah, sekarang faviconnya sudah muncul.

Favicon ini bisa ditambahkan ke blog atau situs yang memiliki nama domain sendiri atau self-hosted. Kalau blogmu “nebeng” di WordPress atau Blogspot, ya mau tidak mau pakai favicon milik mereka. Atau barangkali ada trik khusus untuk bikin favicon di free account WordPress/Blogspot yang saya belum sempat ngoprek, silakan beri tahukan di bagian komentar. Gak bayar kok (ya iyalah).

Follow me on social media:

Comments

16 responses to “Menambahkan Favicon di Blog”

  1. christin males login Avatar
    christin males login

    aku udah pake favicon sendiri :))

    1. Oom Yahya Avatar
      Oom Yahya

      Siiip :))

  2. sabaiX Avatar
    sabaiX

    rrr… I’m happy with my browser as it is. Makin simple, slim dan sesedikit mungkina makan tempat makin baik (efisien). Perlu nambahin favicon juga gak?

    1. Oom Yahya Avatar
      Oom Yahya

      Rrrrr, keknya salah paham nih kak Sabai. (lol)
      Ini bukan masalah browser, tapi menampilkan logo blog/situs di bagian address atau title bar browser.
      Coba lihat deh logo di sebelah address yahyakurniawan.net atau judul blog di atas

  3. sandalian Avatar
    sandalian

    Ada cara yang lebih simpel Mas, yaitu filenya diupload ke public_html (root web directory) dengan nama favicon.ico. Ga perlu nambah script apapun.

    Hanya saja akan ke override kalo di header ada script yang manggil favicon lain.

    1. Oom Yahya Avatar
      Oom Yahya

      Wah, makasih infonya, ndal. (worship)

  4. erricgunawan Avatar

    Untuk nambahin favicon di WordPress.com bisa kok Pak.
    Ini buktinya: http://ericgunawan.wordpress.com/

    Kalo gak salah ada di bagian Setting. Lupa persisnya di mana. Sayangnya, saat komentar ini diturunkan sy gak bisa masuk WordPress.com, gara-gara koneksi lagi down mungkin (taser)

    Yang baru sy cari itu, cara nambahin favicon di aplikasi RSS Reader semacam Google Reader. Kalo yang dari WordPress.com malah bisa otomatis. (doh)

  5. Oom Yahya Avatar
    Oom Yahya

    Matur tengkiu, kak Eric. Ditunggu info lebih lengkapnya. (drinking)

  6. Billy Koesoemadinata Avatar

    oh, jadi di html-nya. kirain ada plugin-nya kalo pake wordpress. *mikir kapan mau bikinnya*

    1. Oom Yahya Avatar
      Oom Yahya

      Gak wajib kok Bill, take your time :))

  7. Ceritaeka Avatar

    Aku udah pake favicon sendiri dunk oom.. Tapi dulu caranya gimana, lupa. Hahaha

    1. Oom Yahya Avatar
      Oom Yahya

      Baguslah kalau begitu. Blognya diperbaiki lagi biar kalau pada komentar, gak moderasi melulu (ngacir)

  8. bocah petualang Avatar

    Di WordPress.com itu ada di bagian Pengaturan Umum (General Setting) di sebelah kanan.
    Di Blogspot sama dengan cara di artikel Om Yahya, tinggal edit template aja pake editor yang disediakan blogger.com 🙂

    1. Oom Yahya Avatar
      Oom Yahya

      Wokeee (drinking)
      Makasih banyak buat infonya (worship)

  9. indra Avatar

    makasih ya gan,ilmu yang bermanfaat 😀

  10. Ponsel baru Avatar
    Ponsel baru

    terimakasih infonya ya mas….
    nambah ilmu buat saya.hehe

Leave a Reply

Your email address will not be published. Required fields are marked *