Menambah Favicon Pada Blogger

Salah satu ciri yang membedakan blog kita dengan blog orang lain adalah adanya icon (lihat contoh pada gambar di bawah ini)



Oleh karena itu, sebagai pembeda dengan blog lain, aku pun berniat untuk mengubah ikon B pada blogger dengan ikon buatan sendiri yang mencerminkan identitas blogku.

Cari-cari cara menambah favicon pada blogger, kebanyakan menggunakan gambar ikon (format .ico) dengan nama favicon. Cara ini menyulitkan karena kita susah mengupload gambar dengan format .ico ke penyedia hosting gambar (misalnya Photobucket).

Kepikiran juga, apakah tidak bisa membuat ikon blog kita dengan gambar selain format .ico sehingga proses pembuatannya lebih mudah. Jika menggunakan wordpress dengan hosting sendiri tentu masalah ini tidak ada karena kita bisa langsung upload file bersangkutan di server kita.

Setelah cari sana-sini dengan bantuan om google, akhirnya ketemu juga cara memasang favicon dengan gambar format lain. Dalam hal ini aku menggunakan gambar format .jpg. Jika anda menemukan masalah yang sama denganku, mungkin tulisan ini bisa membantu anda.

Berikut adalah cara memasang logo favicon dengan gambar format .jpg (anda bisa menggunakan gambar format lain.

Siapkan dulu gambar yang akan kita gunakan (aku menggunakan gambar format .jpg dengan ukuran 48x48 piksel).

Upload gambar tersebut, bisa di situs penyedia hosting gambar semacam Photobucket, atau buat postingan di blog dengan memasukkan gambar tersebut. Catat alamat image yang telah kita upload. (Jika anda memposting artikel berisi gambar tersebut, setelah artikel dipublish, klik kanan gambar dan klik "copy image location". Pastekan di notepad atau program pengolah kata yang lain.)

Langkah selanjutnya, masuk ke dashboard blogger dan klik tab Layout > Edit HTML. Jangan lupa beri centang pada Expand Widget Templates.
Cari kode </head> dan kopikan kode berikut persis di atasnya :
<link href="" rel="shortcut icon"/>
<link href="" rel="icon" type="image/png"/>

Setelah kita punya kode diatas, masukkan alamat file gambar yang tadi kita catat di antara 2 tanda petik pada kode href. Sesuaikan tipe gambar yang anda pakai dengan tipe yang didefinisikan disini. Jika anda memakai tipe gambar jpg, ganti tulisan png dengan jpg.

Hasil akhirnya akan tampak seperti berikut ini (contoh adalah favicon yang aku pakai di blog ini)

<link href='http://bel4j4r.files.wordpress.com/2008/12/ikon-bg.jpg' rel='shortcut icon'/>
<link href='http://bel4j4r.files.wordpress.com/2008/12/ikon-bg.jpg' rel='icon' type='image/jpg'/>

Semoga bermanfaat.

Tweet

Artikel Lain Yang Berhubungan