Blog Archive

Cara Membuat Favicon

Buat para Blogger baru nama favicon pasti begitu asing di telinga. Sebenarnya yang namanya favicon itu letaknya tidak jauh dari address bar atau judul halaman sebuah blog. Tepat di sebelah kiri tulisan halaman url letaknya. Seperti ini contohnya :

Sekarang sobat sudah bisa membayangkan akan membuat favicon seperti apa untuk Blog sobat. Sobat bisa merancang sendiri lewat Photoshop atau kalau tidak mau repot bisa mendownload gambar di Internet.

Bagaimana caranya membuat favicon nya?
Untuk membuatnya, sobat harus punya gambar yang akan dipakai untuk membuat faviconnya. Jika sudah punya, simak baik - baik caranya berikut ini.

  1. klik Browse dan cari gambarnya di komputer sobat. Kemudian klik Upload Image


  2. Atur sendiri gambarnya, tarik kotak view sampai penuh (besar).


  3. Klik ukuran yang sobat inginkan kemudian Klik Capture & Preview. Pilih ukuran yang paling kecil saja.


  4. Selanjutnya klik Download: jpg dan simpan gambarnya di komputer sobat.


     
  5. Langkah selanjutnya adalah sobat harus mengupload gambar tersebut ke tempat penyimpanan online, contoh adalah ke Photobucket atau Google Sites.
  6. Sekarang anggap saja sobat sudah menyimpan gambar sobat di tempat penyimpanan online, seperti ini contoh gambar yang telah saya simpan di google sites :
    http://sites.google.com/site/dodyfarial/image/RSS-Blue.png
  • Buka Blogger, masuk menggunakan ID sobat. 
  1. Pilih Tata Letak.
  2. Klik Edit HTML.
  3. Pada halaman HTML, sobat harus mengganti tulisan yang saya tandai dengan warna ungu dengan alamat url favicon sobat : 
    <link href='http://sites.google.com/site/dodyfarial/image/RSS-Blue.png'rel='shotcut icon'/>
  4. Kemudian letakkan halaman url baru sobat diatas kode </head>
  5. Kemudian Save Template, mudah kan.

CARA II

Login ke blog Anda, klik menu "Rancangan" --> "Edit HTML" dan cari kode berikut dengan menekan ctrl + f dan copy pastekan kode berikut pada kotak pencarian :
<b:skin><![CDATA[/*
Lalu copy/pastekan code dibawah ini tepat diatas code <b:skin><![CDATA[/* yang tadi:
<link href='kode img dari icon Anda' rel='icon' type='image/gif'/>
Ganti teks warna merah dengan kode img icon Anda. Lalu klik tombol "Save Templates". Dan lihatlah blog Anda sekarang. Jika berhasil, maka favicon blogspot akan berganti dengan favicon pilihan Anda.



CARA III
Setelah iconnya diupload. Copy alamat URL dimana icon Anda disimpan. Login ke blog Anda. Klik Design -> Edit HTML. Cari kode yang dibawah ini:
    <title><data:blog.pageTitle/></title>

Letakkan kode dibawah ini dibawah kode diatas

Jika iconnya disimpan dalam format .GIF, gunakan kode ini :

<link href='alamat URL icon Anda' rel='shortcut icon' type='image/gif'/>

Jika iconnya disimpan dalam format .PNG, gunakan kode ini :

<link href='alamat URL icon Anda' rel='shortcut icon' type='image/png'/>

Catatan:
Ingat ganti alamat URL icon Anda dengan alamat URL dimana icon Anda disimpan. Misalnya, http://i25.photobucket.com/albums/e80/user/favicon32x32.gif

Kalau sudah, klik Save Template. Jika berhasil akan muncul "Your changes have been saved". Klik View blog untuk melihat hasilnya.


Selamat mencoba !!
Semoga berguna dan bermamfaat...


    2 Comment:

    Andhrian said...

    kode img dari icon Anda itu mksd'a kode image apaan kurang bagus tutor'a ???

    Trikblogger.com said...

    Maksudnya kode image yg agan upload pastekan di tulisan yg warna merah itu contoh :
    (http://i1130.photobucket.com/albums/m529/Trikblogger/favicon.jpg)ini diletakkan di kode merah

    Post a Comment