Skip to Content

Blog’s Favicon and App Icon

A while ago, we upgraded the blog to WordPress 4.3 which now has a new feature: Site Icons! This is also known as favicon which is short for “Favorite Icon”. Favicon is an icon where anyone can see their shortcut icon, website icon, bookmark icon, or mobile/tablet app icon. Here’s some examples of a web browser:

favicon on web browser

See default favicon before we add new favicon.

 

favicon on web browser

See new favicon after we added new one.

Now, your blog site allows you to upload images that will appear as an app icon (mobile or tablet) and favicon. Just go to “Appearance” > “Customize” then find “Site Identify” and click it. This is the section where you are allowed to change the site title and tagline. Now it includes site icons so you can upload an image. It is a best practice to size the image as 512px by 512px (or larger, it will allow you to crop). Yes, I know it’s a pretty large image size for a web browser but it helps to make the icon look great on the user’s mobile app.

If you would like to know how to add it to your iPhone (same thing with iPad and same concept with another mobile/tablet), here are some instructions:

  1. Pick which webpage you want to use as default homepage and click share button on bottom (see Fig. 1)
  2. Select “Add to Home Screen” (see Fig. 2)
  3. Fill description as you wish (see Fig. 3)
  4. Now it’s added to your iPhone screen (see Fig. 4)

It’s nice to have shortcut instead of going to a web browser on your mobile/tablet and typing url all over again!