To add a Touch Icon to your Blog or website, simply create the file favicon.ico and upload it to the root of your domain. It’s better you don’t use any HTML tags, for cross-browser compatibility.
Many web sites have this code:
<link rel="shortcut icon" href="/favicon.ico" />
The “shortcut” link tag it’s not a standard tag. It doesn’t appear in the Link types HTML5 specification because this is on the fact an Explorer tag.
How to add a Touch icon to your site
To add an icon to your website put this code in the <head> tag:
iOS 2.0+ and Android 2.1+ (Apple Touch Icon)
<link rel="apple-touch-icon-precomposed" href="/favicon-152.png">
IE 10 (Metro icon)
<meta name="msapplication-TileColor" content="#000000">
<meta name="msapplication-TileImage" content="/favicon-144.png">
Replace #000000 with your favorite color and set the file path if it’s not in the root.
Favicon and Touch Icon Sizes
Desktop (favicon.ico)
16×16 & 32×32
iOS/Android icon ( favicon-152.png)
152×152
iPad retina (favicon-152.png)
152×152 (Change for iOS 7: up from 144×144)
iPad home screen icon (favicon-72.png)
72×72
iPhone retina (favicon-120.png)
120×120
Standard iOS home screen: iPod Touch, first iPhone generation until 3G version (favicon-57.png)
57×57
IE10 Metro tile (favicon-144.png)
144×144
High-quality WordPress Themes to build your website
Building your blog, magazine, or shop is now easy with our Premium WordPress themes.
Otherwise, you can try our Free WordPress themes available from the official WordPress.org repository.