Post content

Favicons in WordPress

If you want to include favicons as part of your WordPress theme then you should add the following code into the header of your pages. The code includes a tag for standard favicons as used by most web browsers. It also includes a tag used by Apple devices such as iPad and iPhone.

Code for adding favicons to your WordPress theme:

<link rel="shortcut icon" href="<?php bloginfo('template_directory'); ?>/favicon.ico" />
<link rel="apple-touch-icon" href="<?php bloginfo('template_directory'); ?>/icon.png" />

You then need to create a favicon.ico file and a icon.png image file and add these to the template folder.

The icon file should be an image 16×16 pixels.

The .png file for Apple devices should be 57×57 pixels (although I have seen some suggestions that 114×114 is best for later Apple products). Don’t worry about adding the curves and shiny effects that you see on the Apple devices, these will be added automatically.