Adding a Favicon / Site Icon to your WordPress Site

Tutorial

Chances are, you’ve bookmarked a site to re-visit it later. And, if you have, you’ve seen the small icon that shows up next to the site in your bookmarks.

See the first three? No icon.  The final one, however does have an icon – called a ‘favicon’ associated with it.  WordPress, for a long time, didn’t have a native way to include favicons – we had to use plugins like All-in-One Favicon to get the icon to show up.  Now, the WordPress customizer actually has a native way to bring that icon into WordPress – the “Site Icon” option.

Adding a Favicon

To get to it, open up your WordPress Dashboard and click on “Customize”

The customizer will open – allowing you set various options in your website at a glance.  The top option, Site Identity, is where we’ll find the settings for the Site Icon.

The site icon has to be at least 512px wide and tall – preferably a square image.  The icons can have transparency, and it’s best if you have a .png image to use.

Not only do Site Icons get used as the favicon, but if a user adds your website to their home screen (via Android or iOS), that icon will also appear there as well.