Favicon (“favorite icon“) is a small icon symbolizing a website or blog. These icons are created by the site owners or can be found already created in some WordPress themes. It is sometimes forgotten, but it is importan in the graphical identity of the site.
Web browsers use favicons in the address bar, title bar, bookmarks, tabs, and other shortcuts. When you have multiple tabs open in your browser, for ex., favicon helps you to identify the specific pages.
How to create a favicon
The usual size of a favicon is 16×16 pixels. The formats used for a favicon are: ICO, PNG, GIF, animated GIF, JPEG, APNG. Internet Explorer and Safari browsers support the first three formats only.
For Apple devices with the iOS (iPod Touch, iPhone, iPad), and Android devices, it is possible to provide a custom icon using the Web Clip feature. The recommended basic size for this icon is 60×60 pixels. Best size for the higher-resolution iPhone 4 screen is 120×120 pixels. For iPad and iPad 2, the basic size is 76×76 pixels. For the third-generation iPad, best high-resolution size is 152×152 pixels. The Android tablets prefer a 192×192 pixels PNG icon.
It is very easy to create your favicon. You can start from the existing logo of the website, or from another image (usually a simpler image) that symbolize the best the content of your website or the message you intend to deliver.
ICO, PNG, and GIF files can handle transparency. This will be more attractive in the browser.
After you decided what image will be used for the favicon of your blog, you can gnerate it online or using an image editor.
For the online version, you can search an online service with Google, or use directly favicon-generator.org, for ex.
If you want to edit it offline, you can use any image editor to resize the image and save it in the desired format, including the old Paint. For ICO format, you can use a specific add-on for Adobe Photoshop to enable it ro save the file as ICO.
Install the favicon on a WordPress blog
The usual path for a favicon is in the root of the website.
The installation of the favicon on your blog can be done in several ways. This depends on the theme you have installed.
Use your theme options:
Many themes offer advanced options to upload the favicon, including the web clip icons for Applte devices and tablets.. In this case, the set of a favicon is a formality. You simply go to theme options, usually in the Appearance menu, then go to Theme Options or Customize and upload the favicon (and web clip icon, where the theme allow it).
Replace the old favicon:
Some themes provide a favicon but does not offer the possibility to change it. The easiest way in this case is to replace it using a FTP program to upload the new favicon.
Install a favicon using Media Library
If neither of these options is possible, you upload your favicon as image and edit the header of your theme to tell the new path of the favicon.
For this, go to Appearance > Editor, and find the link for the file that includes the path to the favicon (usually Header (header.php), for the old simpler WordPress themes) in the right of the page. Click it.
In the editor of the WordPress admin will open the file ready to edit it. Search for something like:
<link rel=”shortcut icon” type=”image/x-icon” href=”favicon.ico” />
Change “favicon.ico” with the path of the image (for ex., “https://www.telework.ro/wp-content/uploads/2015/04/favicon.png”).
Good luck!
Leave a Reply