Home » Komputer » Software » Photoshop » Photoshop : Membuat dan Pasang Favicon Blog

Photoshop : Membuat dan Pasang Favicon Blog

Cara membuat dan memasang favicon blog dengan Adobe Photoshop. Favicon adalah icon yang tampil di sebelah adrress bar pada situs yang sudah membuat dan memasang kode pada templatenya. Dengan adanya icon blog ini, menjadi sebuah ciri khas tertentu dari blog tersebut. Pada umumnya favicon ini representasi dari logo lembaga atau perusahaan. Dan tentunya bagi yang personal dapat membuatnya sendiri menggunakan Photoshop.

Favicon selain sebagai bentuk pencitraan, juga berfungsi mempercantik blog saat diakses seseorang yang browsing internet. Desain favicon yang unik dan mempunyai ciri khas, tentunya akan membuat pengunjung mempunyai ikatan emosional :) sehingga selalu ingat nama domain blog kita, dan yang diharapkan tidak lain yaitu untuk selalu rutin mengakses :) . Ini barangkali juga termasuk menjadi tips SEO ya.

Selain tampil di sebelah address bar, favicon ini juga menjadi ciri khas pada titel bar (tuh di sebelah atas), saat di bookmark juga tampil (tekan Ctrl+D, Folder pilih Bookmarks Toolbar), hasilnya jadi lebih indah, cantik nan eksotis situsnya :) seperti gambar di bawah ini hasilnya di web browser Mozilla Firefox

Gambar Membuat Favicon Blog

Untuk membuatnya cukuplah mudah, cukup copy-paste file format favicon ( ico format ) ke dalam folder installasi Adobe Photoshop. Silahkan download file ico format untuk membuat favicon klik di sini (link download ada di bagian bawah kanan, cari saja di situ). Tersedia untuk Windows 32bit atau 64bit. Plugin ico format bersifat free, jadi jangan kuatir, silahkan langsung download.

Setelah download file ico format, copy file tersebut, selanjutnya buka folder

(c:\) » Program Files » Adobe » Adobe Photoshop (CS/CS2/CS3/CS4) » Plug-Ins » File Formats (Paste di folder ini!!)

Sedangkan ukuran untuk membuat favicon bisa memilih, 16×16 px, 18×18 px, 32×32 px, atau 64×64 px. Semua tergantung tingkat kerumitan desain yang akan dibuat. Tetapi yang perlu menjadi catatan, semakin besar resolusi yang dibuat, maka juga akan semakin besar size yang dihasilkan. Itupun juga bergantung pada desain.

Setelah membuat icon blog sendiri, saatnya untuk memasang di theme atau template blog agar bisa tampil, bagi pengguna CMS WordPress, silahkan copy-paste favicon yang telah dibuat (file bernama favicon.ico) ke dalam folder images theme WordPress. Copy kode di bawah ini

<link rel="shortcut icon" href="<?php bloginfo('template_directory'); ?>/images/favicon.ico" type="image/x-icon" />

kemudian buka file header.php, cari kode </head>, paste di atasnya atau sebelum kode </head> ( pokoknya di antara kode <head> ….. </head> )
Catatan: kata images yang berwarna merah namanya disesuaikan dengan nama folder theme WordPress tempat meletakkan favicon.
Maka sekarang blog sudah muncul icon pada address bar.

Bagi pengguna blogger, tidak jauh berbeda, memasukkan seperti kode di atas pada template xml (cuma sedikit beda, tapi prinsipnya sama). Tergantung di mana url favicon di upload. Misalnya blog Propenil saya, menitip di sites.google.com, maka url untuk menampilkan favicon menjadi seperti di bawah ini

<link href='https://sites.google.com/site/propenil/p3/favicon.ico' rel='shortcut icon' type='image/x-icon'/>

Kemudian copy-paste link url favicon untuk Blogger ini pada template.xml sebelum kode

<b:skin><![CDATA[/*

Demikian saja cara membuat dan memasang favicon (ico format) pada blog menggunakan program Adobe Photoshop. Selain sebagai icon blog, juga bisa untuk mengganti icon folder Windows. Terima kasih dan selamat mencoba.

Share to : Facebook | Twitter | Digg | Google | Technorati | Stumbleupon | Delicious | Reddit |

Artikel terkait :

Random Posts :

Leave a Comment