Dalam pelajaran HTML kali ini kita akan mempelajari tentang bagaimana cara menampilkan Favicon di browser.
Favicon (Favourite Icon) adalah sebuah icon image yang berukuran kecil yang ditampilkan di address bar dan tab browser.
Dengan adanya favicon ini memang kelihatan menarik, bahkan kita bisa hafal suatu situs web dengan hanya melihat favicon-nya, jika kita memiliki banyak bookmark di browser kita, maka kita akan melihat beraneka ragam favicon disana.
Lantas bagaimana cara menampilkan favicon tersebut?
Pertama, anda harus memiliki gambar yang ber-ekstensi .ico, yang standar ukurannya sekitar 16X16px, program grafik seperti Photoshop atau Corel Draw bisa membuat jenis file ini, namun jika anda ingin yang siap saji anda bisa mendownload darifreefavicon, ratusan favicon menarik dapat anda temukan disana.
Jika anda sudah menemukan icon yang anda sukai, download dan simpan icon tersebut ke komputer anda dengan nama “favicon.ico”
Selanjutnya agar dokumen html dapat menampilkan icon ini, kita harus menambahkan kode berikut ini di antara tag elemen <head> dan </head>:
Setelah dimasukkan kedalam dokumen html maka akan terlihat seperti dibawah ini:
Buka Notepad kemudian salin kode diatas dan simpan ke komputer dengan nama “testicon.html” jangan lupa agar menyimpannya di folder yang sama dengan favicon.ico tadi.
Selanjutnya dengan browser buka file “testicon.html” tersebut, maka jika anda melakukannya dengan benar maka favicon tersebut akan tampil di address bar dan tab browser seperti berikut ini.
Memasukkan kode favicon ke WordPress secara manual.
Caranya adalah dengan memasukkan favicon.ico tersebut ke folder themes favourite kita, kemudian buka file “header.php” dan masukkan kode berikut ini diantara tag elemen <head> dan </head>:
Cara ini tidak bisa dilakukan di WordPress.com, karena kita tidak diizinkan untuk mengedit template.
Bila ingin mengganti favicon di Blogger ini ada artikel yang lumayan detil Menampilkan Faviocon pada Blog.
0 komentar:
Posting Komentar