WordPress 4.3 now has a feature to make it easy for you to add a site icon or favicon to your website, and this feature is supported in Genesis 2.2. The favicon is the little image that identifies your website in the browser bar and bookmarks. It’s also a site icon because the same icon will now be used as an app icon when saving a website on a mobile device. And if you change themes, you won’t have to figure out how to upload your site icon again.
For the new site icon, it’s best if you can upload an image that is 512px square. You can also upload larger images because you will be allowed to scale and crop, but it’s probably best if you resize before uploading. If you upload a smaller image, it will scale to 512px and be blurry.
Some themes, including Genesis framework and child themes, come with a default favicon.ico that is 64px square. For Genesis themes, the favicon is located in the “child-theme/images” folder. You could change to a custom favicon by creating one the same size and uploading it using your hosting file manager or FTP.
Add Site Icons to WordPress
But now you can change the site icon without using FTP; you can upload directly with WordPress! How easy is that? And best of all, it will be replaced immediately without having to clear browser caching.
Download New Site Icons
If you already have a custom favicon, you don’t need to change it.
But if you don’t have a custom favicon, I’ve created some site icons for you to download. These can be used in any WordPress theme (not just Genesis). They are the same style as the default Genesis favicon – a black circle with a white letter in the center. They are 512px square, and there is one for each letter, so you can choose something other than the default G icon.
These are free to download and use on your sites.
How to Add New Site Icons to your WordPress Website
- Click Appearance > Customize
- Click on the Site Identity option
- Below Site Icon, click on Select File (1)
- Click Upload Files tab and then Select Files, and then choose your site icon image.
- You may be asked if you want to crop.
- Then you can preview your site icon (2)
- Click blue button Save & Publish (3)
That’s it; lots easier to add a custom site icon that before!