What is a Site Icon?
A Site Icon (Previously called a Favicon) is the small site icon image you see before a website title in the browser address bar. It helps users visually identify websites in browser tabs.
When a page is bookmarked or “favorited” the favicon (favorites icon) will also be displayed in a list of bookmarks beside the page title.
The name “favicon” isn’t widely known, people are searching but not finding the right results. Students have asked us questions such as:
- How do I add an avatar to my url?
- How do I add a thumbnail image to the top of the site?
- How can I add a logo to my browser navigation bar?
Knowing the term favicon is important to a successful search.
Step-by-Step instructions to add a site icon:
Step 1: Prepare your image
Prepare an image that you want to use. The image needs to be at least 512px in width and height. You’ll need to be able to crop in on a square image. Keep the image simple.
Step 2: Open Customize
You can access Customize either from the front-end toolbar or, in the WordPress admin area go to Appearance → Customize.
Step 3: Click Site Identity
The site identity section in WordPress Customizer allows you to edit your site title, description and upload a site icon.
Step 4: Click Select Image
Change the tab from your Media Library to Upload Files. Browse your computer for the image you’ve prepared and upload it to the media library. WordPress will allow you to crop the image. But if you prepared it to the recommended size exactly, then you won’t need to.
Step 5: Save & Publish
Before you move away from Customizer, click Save & Publish
That’s it! These new instructions are a much easier five steps.