Ping!

Did you ever notice some websites when added to your Home screen on your iPhone, iPod Touch, iPad, or Android device; that the bookmark appears as a Icon instead of some generic thumbnail of your website or that annoying red bookmark icon for Andriod?

Well here is how you create one:

Make a .PNG file that is 57 x 57 pixels. Save it as a “apple-touch-icon.png” and a “apple-touch-icon-precomposed.png.” Yes 2 files of the same thing. I used my original file that I used for my favicon.ico.

Upload both of them to your root directory. It is usually “public_html” or “www” folder.

Add the following code to your Header code or header.php on your WordPress template file:

Don’t forget to change the URL. The experience of making my favicon.ico file made this seem easy. I encountered no difficulties making my .png files. When I put my files in my root directory my WordPress website did not load my .png icons when I created my bookmarks. I had to put the exact url with the <link rel…> code. Well to my fellow bloggers I hope this helped.