Site Icon Tool – Favicons Just Got Easier

What the Heck is a Favicon?

Glad you asked! It’s that cute little pic you see in browsers in the URL bar (for Safari) or tab (for Chrome and Firefox etc.) on your computer. But these days a favicon is also used by your iPhone, Android device, tablet or, gasp, internet fridge. Now with so many gadgets using the favicon for a website icon, it’s more difficult for makers of websites to accommodate many sizes.

Load it Up Once, Serve it for Everything

Fortunately, the WordPress team has noticed this issue and incorporated a dashboard feature in Customizer that allows you to upload just one image for several sizes.

Here’s how to take advantage of the new site icon feature:

• For business owners, your logo is your identifier for your brand. Place your logo artwork in a 512px wide by 512px height (px stands for pixel) image and save as a jpg or png. This image will be used for small sizes too (down to 16 pixels on the old browsers), so keep it simple.
• Verify the image file size is small; if it’s going over 50k, use compressor.io to shrink it down. Why? So mobile devices don’t eat up bandwidth and download time with an overly large image.
• Login to your WordPress dashboard to Appearance > Customize. Click on the "Site Identity" tab on the left.
• Click on "Select File" and load your new 512×512 logo file into the Media Library. Click Save or Select.
• To save your new site icon (Favicon), click "Save & Publish" at the top.

There you go, really easy! To see the icon in browsers, be sure to clear your cache (history). Now your logo icon can be easily viewed on many devices!

FYI, WordPress themes will discontinue the old favicon methods, so be sure to make the transition to the "Site Icon" feature soon.