What's WP
Find Everything Related to WordPress - Best Tutoriasl on WordPress!
How to Add Favicon to WordPress to Increase Site Recognition

How to Add Favicon to WordPress to Increase Site Recognition

For any webmasters who are wishing to set up a successful website, increasing the online recognition of the site among Internet users can be regarded as the top priority. To achieve this goal, adding a favicon is one of the most basic steps. In the following, we have shown you what the favicon is and how to add favicon to your WordPress site easily.

Why Favicon

The favicon, also known as a shortcut icon, is a small image exclusively associated with a particular website. Generally, it appears in the title bar of the browser, next to the website title. If you still feel confused what it is, simply check the following image to figure out the answer.

what is favicon

In fact, this tiny icon has 2 major advantages that can benefit both your site and your readers.

  • For Website – The favicon can set up an instant mental link between the site and visitors; thus build your website brand and recognition effectively. This means once people see that small symbol they can realize immediately that this is your website. As researched, people are more likely to remember a beautiful image than to remember a plain textual title.
  • For Readers – In addition to the improvement of the site identification, a favicon can also improve the reading experience for visitors. It is inevitable that people many open a lot of tabs in their browsers, which means your site title may be squeezed into one or two letters as the number of tabs increases. Thus, people may feel hard to identify you and switch to your site again. In this circumstance, a favicon displayed in the title bar can help them find you easily and quickly.

How to Add Favicon on WordPress

In the very beginning, you need to create a favicon for your website. This requires you to find a special icon that is unique, impressive, easy to remember, and can match your content the most. You can do this on your own or ask for help from some experienced designers. Note that the image needs to be 16×16 pixels in size, along with a .ico format, making sure that your favicon can be showcased successfully in any browsers and viewing devices.

In fact, you can search for a large and square image at first; thus you can process and work on it easily. Then, you can make use of an image processor like Macromedia Fireworks to resize it into 16 x 16 pixels. Before saving this image, you need to select the PNG format and convert the .png suffix into .ico in the file name section.

create favicon

Once your own favicon has been created, you can upload it to the root directory of your WordPress site with the help of a FTP program. If you are not familiar with the FTP, simply log into your hosting account and go for the root directory; thus you can add the file directly. There is a special tip that this file has to be uploaded in the right location and is accessible at sitename.com/favicon.ico.

Next, you can navigate to your WordPress admin panel and go to Appearance < Editor < Header. Then, add the following lines of code into the header.php file between the head tag.

<link rel="icon" href="/favicon.ico" type="image/x-icon" />
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />

Note that you need to replace the whatswp.com to the URL of your own website. Now, you can refresh your browser, and check how your favicon looks next to the website title.


Susan Rose is a freelance writer who has a deep knowledge about WordPress. She loves everything related to website building since the freshman year at Christopher Newport University, and loves to share her experience with people all over all the world. In the daily life, Susan loves detective novels as it can train her logical thinking and creativity.