Favicon has become increasingly popular and it is now seen as an imperative feature of a website. Favicon is cool, it provides individuality and uniqueness. It also serves a few purposes.
A favicon is basically the small image or icon that you see on the tab of the browser. Traditionally, the tab or the browser has sported the logo or icon of the browser and the title of the website. Some websites don’t have titles but just the name of the website or the company. Some websites have names along with a title and description. A favicon is an image that replaced the browser image. It can be the company’s logo, a unique icon or any trademark that a company has.
All major websites today have a favicon. Google has a ‘g’ in lower case against a blue background, Gmail has the symbol of an envelope emulating the classic look of a mail with a dash of red marking an ‘M’ and WordPress itself uses its logo as the favicon. A favicon is an integral part of branding and it is also a part of stylizing your online presence. From the perspective of utility, a favicon helps users to easily identify the website opened when there are too many tabs and the titles or the descriptions of the websites become concealed.
Creating a Favicon for WordPress Site
Creating a favicon is pretty simple. All you need is an image or logo. You need this image to be in 32×32 pixels in most cases or 16×16 pixels. You can use a typically file formats for images as contemporary browsers will accept such formats. In case an old browser doesn’t accept a PNG or JPG file, you need to convert the image file into an .ico file. There are many free converters out there that you can use for this purpose. Now, a 32×32 pixels image or a 16×16 pixels image would be too small to manage, edit or toy with. Thus, you can create a larger image, say of 128×128 pixels, and you can then resize it.
Adding a Favicon to a WordPress Site
There are many ways to add a favicon to a WordPress site.
1. You can upload the image or the favicon to the root directory of the website using FTP. You need to add a specific code to the header.php file of the theme you are using on your WordPress site. The code is:
link rel=”icon” href=”http://www.websitename.com/favicon.ico” type=”image/x-icon”
link rel=”shortcut icon” href=”http://www.websitename.com/favicon.ico” type=”image/x-icon”
‘websitename’ is the name of your website. Use it exactly as it is in the URL.
2. In case you don’t have a header file which is quite possible in certain themes, then you need to use a plug-in. You may choose to use a plug-in even if you have a header.php file. Should you not have such a file, you can install a Headers and Footers plug-in. You need to activate this plug-in from the settings and then use the same code in the header section.
3. There are special plug-ins available today that are used solely to add a favicon to WordPress. You can check them out.
When you choose a theme for your WordPress site, you may want to check out its compatibility with a favicon. Not all themes are compatible. You can go to the options page of the theme and check out the favicon section. Some themes come with preloaded favicons today that you can select from and use. Some themes will allow you to create a favicon within the interface. Some will use whatever image you provide. There are themes that don’t require the coding. You would simply add an image like you do with your email attachments or simple uploads to FTP and from within the theme’s option page you would have the favicon added to the site. This is actually the simplest way of going about it. No coding, no need to download or install any special plug-in and no third party tools to be activated.
If you have to use plug-ins then there are many available for free. Some plug-ins are loaded with problems or bugs. You must read the reviews of such plug-ins before deciding to use any. While some may prefer the manual upload or adding of the favicon to a WordPress site, using a plug-in or theme enabled upload is easier and quicker. Also, when you are in the business of running multiple websites and when you may have to use multiple favicons, it is easier to manage them when you do so from within the options page or from the control panel. You can get to see which one is added, removed, active and disabled. Doing it manually can be a hassle, especially with sites that have different favicons for specific sections or pages.
