How to Add a Favicon to Your WordPress Site
What exactly is a favicon? You may have never realized that is the name of the little square box in each of the tabs open in your internet browser.
This is a small logo, so why bother right? There are two reasons you should care:
- It’s good for branding / site identity.
- It allows users to place an icon of your site on their mobile so they can open up your site quickly and easily. Having your site favicon on a device that someone looks at everyday can help keep your site top of mind.
Step 1: Create the Favicon
The favicon is an image file that is added to your WordPress site and it must be 512 by 512 pixels. For this, it is best to use a photo editing tool such as Photoshop (requires a paid subscription to download or use online), Gimp (free to download), or Pixlr (free and online). If you’ve never edited an image before, start with Pixlr by checking out this tutorial.
Three important items to note:
- The most important part is that the image is perfectly square. If you’re unable to resize the image to 512 by 512 pixels in a photo editor, note that you are also able to crop an image in WordPress.
- The favicon image background can either be transparent or filled with a color of your choice.
- Acceptable image formats include: png, jpeg, or gif.
Once you’re done editing, save the file to your computer so you can upload it to your WordPress site.
Step 2: Insert the Favicon to Your WordPress Site
Now that you’ve saved a perfectly square image, you’re ready to upload it to your WordPress site. To do this, log into your admin panel and navigate to Appearance > Customize, then go to Site Identity. You’ll see this to the left:
Click Select Image and add the image you saved on your computer. If the images is too large, you WordPress will allow you to crop it.
After this, make sure you save your changes, and then preview your site to see the newly added favicon.