Cara Memasang Favicon di WordPress

Bang Haris Ahmad bertanya begini: “Oia kang minta cara buat itu dong kalo di browser biar muncul lambang / logo blog”. Dengan kata lain, beliau bertanya mengenai cara membuat dan memasang favicon (favorite icon).

Favicon di blog wordpress.org bisa dibuat secara manual atau menggunakan plugin. Saya sendiri sudah menggunakan kedua cara tersebut. Cara manual saya gunakan dalam membuat favicon di Blogotainmen, adapun cara plugin saya gunakan di blog ini. Di bawah ini kedua cara tersebut.

contoh favicon

Cara Memasang Favicon dengan Plugin cbnet Favicon

1. Pada fitur Plugins, klik Add New

2. Ketik cbnet favicon di kolom search plugins

3. Klik Install, lalu Install Now.

4. Klik Active Plugin untuk mengaktifkannya.

5. Pada fitur Settings, klik cbnet favicon.

cbnet favicon setting

6. Akan muncul tampilan untuk memilih favicon, yaitu favicon yang tersedia, favicon dari komputer Anda, dan favicon dari URL. Anda bisa memilih salah satunya.

choose favicon

7. Setelah itu klik tombol Save.

8. Favicon akan muncul di browser.

Cara Manual Memasang Favicon

Tahapannya terdiri dari 3 langkah: membuat favicon dengan menggunakan situs pembuat favicon, upload favicon ke blog, dan edit header.php untuk memasukkan link favicon.

Membuat favicon

1. Kunjungi situs html-kit.com.

2. Klik browse untuk memilih foto, gambar, atau logo yang hendak Anda jadikan favicon. Selanjutnya klik Generate Favicon.ico.

3. Contoh hasilnya seperti ini. Lalu klik Download Favicon Package dan simpan di komputer Anda.

download favicon package

4. Karena berbentuk WinZip, ekstrak gambar favicon (tipe gif) lalu simpan.

extract favicon

Upload favicon ke blog

1. Login ke wordpress.org Anda

2. Pada fitur Media, klik Add New.

3. Klik Browse dan pilih favicon yang sudah diekstrak tadi. Lalu klik Upload.

upload favicon

4. Akan muncul tampilan Media Library, lalu klik edit gambar favicon yang telah diupload tadi.

media library

4. Copy Link URL dari favicon tersebut. Simpan di notepad atau MS words.

link url favicon

Memasang favicon di header.php

1. Pada fitur Appearance, klik Editor.

2. Klik header.php.

3. Masukkan kode berikut di atas </head>. Ganti huruf yang berwarna biru dengan link favicon Anda.

<link rel=”shortcut icon” href=”http://wwwblogodolar.com/wp-content/uploads/2010/03/animated_favicon1.gif” >

Untuk lebih jelasnya, silakan lihat screen shoot di bawah ini.

insert favicon

4. Klik Update File.

5. Buka blog Anda. Favicon akan terlihat di browser Anda.

Suka dengan tulisan seperti ini?

  • Silakan berlangganan Blogodolar Tips & News sehingga Anda bisa mendapatkannya langsung via email Anda. Caranya mudah dan 100 % gratis yaitu dengan mengetikkan dan mengirimkan alamat email Anda di bawah ini. Jangan lupa aktivasi berlangganan dengan mengklik link yang dikirim ke email Anda. Klik di sini untuk melihat cara aktivasi tersebut.

 

Comments

  1. makasih kang untuk tutornya….
    namun ada beberapa gambar yang menghilang :)

  2. sofyan says:

    makasih infonya kang :)

  3. ikhsan says:

    wah makasih banyak nich mas sangat berguna….sukses buat mas selalu

  4. udah di coba gan tapi kok ga bisa ya…

  5. ummi says:

    Mas, saya dah coba pake cara manual, tapi di langkah terakhir tidak bisa karena tulisan “update file” nya ndak ada. tulisan yang ada di bawah kolom edit header.php itu seperti ini: “You need to make this file writable before you can save your changes.” kira2 itu kenapa ya Mas?

    saya juga dah coba pake cara plugin, tapi katanya “plugin installation is failed”. ini kenapa juga ya Mas?

    karena gagal dua2 nya cara ini, cara apa lagi yang bisa saya tempuh untuk memasang favicon di web saya ya Mas?

    terima kasih Mas.

  6. afran says:

    informasi yg sangat bagus jelas dan terpercaya,,,
    sangat membantu sekali :)

  7. nurfaisyah says:

    Saya mencoba yang cara manual kog tidak berhasil yach ?..tapi pas saya coba yang pake plugin langsung berhasil kog…Terima kasih yach

  8. bagyoe says:

    ikut mampir gan….. info menarik,, makasih informasinya. kunjungan balik

  9. sukses master. thanks

  10. tips2nya sangat bermanfaat akan sya cba,,trima ksh dan slm kenl

  11. nusantara says:

    cool thanks for the information, I can immediately try and directly managed ………………….. thanks a lot.

  12. ini yang saya cari, pake plugin hehe biar lebih mudah. Thanks gan :-)

  13. gambutku says:

    thank infonya ya gan, saya coba dulu di blog wp.org saya.:D

  14. langsung dicoba nih
    ternyata langsung berhasil.
    tks infonya bro.. sukses selalu

  15. nahid says:

    siiiip
    matur thankyou mas bro
    sukses nih
    salam kenal

  16. maya says:

    makasi nifonya, web sy udah pake ikon dlm bentuk gif di http://sucitapura.com

  17. Joe says:

    wow!

    it’s works!

    Thanks for sharing..

    So easy, Simple !

    :D

  18. wow emng benar tips ini….makasih yach

  19. mungkin karena template kami cukup kompleks, cara yang diatas belum berhasil untuk kami. Terimakasih infonya kang, :D

  20. harus di edit menjadi gif dulu y baru ok??

  21. thanks buad infornya…

  22. thanks mas buad infonya

  23. ga bisa brooo………

  24. Sigit says:

    sangat membantu saya dalam belajar membuat blog…
    TERIMA KASIH.

  25. ar yie says:

    mantap gan,…makasih y,..
    di tunggu kunjungan baliknya,…

  26. herpes says:

    makasih banyak ya gan atas infonya

  27. mioma says:

    MAkaasih banyak ya gan atas infonya

Trackbacks

    Speak Your Mind

    *

    CommentLuv badge