Rabu, 30 November 2011

Cara Menampilkan Ikon Blog di Browser

Ikon blog yg terkenal dengan sebutan Favicon (favourite icon) adalah icon kecil yang berada di samping alamat blog atau website anda.Banyak situs terkenal seperti Amazon.com , google mail , Kumpul blogger dll yang mengunakan Favicon sebagai identitas yang menurut saya "Keren" dan 'berbeda' dgn yg lainnya. Apabila anda membuat blog di Blogger.com alias blogspot, maka secara default favicon yang berada di samping alamat URL anda adalah berupa icon blogger. Lihat gambar contoh dibawah :

Untuk mengganti favicon tersebut, anda bisa melakukan langkah-langkah seperti berikut :

1. Pertama pilihlah sebuah gambar atau image atau photo yg tersimpan di file hardisk komputer anda yang akan di jadikan sebagai favicon. Untuk hal ini anda perlu mengedit image tsb menjadi gambar berukuran 32x32 pixel . simpan dengan format gif, jpg, png, dan bmp (pilih salah satu) contoh seperti gambar ikon blog panduan bisnis internet di bawah ini :Note : Untuk cara meng edit gambar silahkan lihat di "Cara Edit Gambar"

Namun Jika anda tidak mau repot mengedit gambar, anda bisa menggunakan jasa pembuat favicon gratis. Silahkan pergi ke salah satu situs dibawah ini:

http://www.favicongenerator.com
http://tools.dynamicdrive.com/favicon/
http://www.Html-kit.com
http://www.tinypic.com

Di salah satu situs tersebut : cari dan Klik tombol Browse...
Masukan gambar yang tadi anda pilih untuk di ubah menjadi format icon
Klik pada tombol Generate Favicon.
Setelah proses selesai, klik pada "Click Here to Download your favicon".
Save ke komputer anda.

2. Langkah selanjutnya adalah anda harus meng upload Favicon yang tadi , ke tempat hosting gambar,atau ke Hosting anda sendiri jika anda menggunakan blog -hosting berbayar. Untuk layanan upload image ke hosting gratis silahkan pilih salah satu dibawah ini :

http://www.photobucket.com atau
http://www.pages.google.com atau
http:// www.geocities.com .

Dalam hal ini misalnya saya mengupload image pilihan saya ke Photobucket.com
Nanti di Photobucket.com saya akan diberikan sebuah URL untuk image yang saya upload. Ambil URL nya yang ber ekstensi seperti ini : http://www.....

Update 27 maret 2010:
Karena ada pertanyaan bagaimana mengupload dan mencari URL image dari photobucket, maka akan saya rinci langkah nya sbb :
1, Daftar dulu ke photobucket.com , gratissss
2. Login
3. Temukan form utk mengupload gambar :

4. Akan muncul jendela untuk mencari dan memilih image yang akan di upload

5. Setelah proses upload image selesai, akan muncul halaman utk pemberian nama,deskripsi dan tags dari image. Jika sudah diberi nama lalu klik tombol "Share"

6. Setelah itu akan dibawa kehalaman yag menampilkan link image yag barus saja kita upload. Pilih "Direct link" untuk keperluan menampilkan ikon blog ini.



Contoh : untuk image ikon panduan bisnis Internet itu link URL dari Photobucket nya seperti ini : http://i420.photobucket.com/albums/pp281/goldenphoto_2009/Iconulum.jpg

(Untuk ngetest : silahkan anda copy paste deh Link URL tsb,dan buka di tab browser baru, Pasti ikon sy itu akan tampil di ikon browser dan di ikon tab )

3. Kemudian.... selanjutnya silahkan login ke blogger anda.
4. Klik pada Tata Letak (Layout)
5. Klik Edit HTML. - centang kotak"Expand Widget Template"
6. Silahkan cari kode </head>
Agar cepat ketemu Tekan : CTRL + F pada keyboard lalu tulis </head>

7. Jika sudah ketemu masukkan script ini :
<link rel="shotcut icon" href="http://i420.photobucket.com/albums/pp281/goldenphoto_2009/Iconulum.jpg" />

Note : Ganti URL http://i420.photobucket.com/albums/pp281/goldenphoto_2009/Iconulum.jpg dengan URL milik anda yg didapat dari Photobucket tadi.

8. Simpan script tsb persis di atas kode </head>. Contoh :

<link rel="shotcut icon" href="http://i420.photobucket.com/albums/pp281/goldenphoto_2009/Iconulum.jpg" />
</head>

9. Lalu klik tombol "Save" atau "Simpan" Template.
10.Selesai. Sekarang anda sudah mempunyai favicon di alamat URL blog anda.

Triks di atas adalah untuk blog di Blogspot, sedangkan untuk Wordpress, yang oleh wordpress favicon ini sering juga disebut Blavatar atau favicon avatar (gambar kecil) .

Berikut adalah cara menampilkan ikon blog di wordpress:
Untuk mendapatkan blavatar untuk blog wordpress Anda, cukup masuk ke dalam Pengaturan(Setting) dashboard dan lalu upload lah foto anda sebagai image. Setelah Anda meng-upload, Anda dapat Mengedit atau "Crop" (dipotong sesuai ukuran yang Anda inginkan).Kemudian Simpan dan Favicon atau Blavatar Anda pun telah siap tampil.

Note : Berbeda jika anda menggunakan browser firefox, opera dan yang lainnya, yang favicon anda sudah langsung dapat di nikmati.Bagi anda yang masih menggunakan browser IE6, favicon anda tidak akan langsung terlihat, coba di bookmark dulu alamatnya.

Selamat mencoba...dan semoga bermanfaat untuk yang belum mengetahuinya.

Tidak ada komentar:

Posting Komentar