How To Add a Custom Home Screen and Web Clip Icon To Your iOS Device

Home/DIY, Technology/How To Add a Custom Home Screen and Web Clip Icon To Your iOS Device

Ever wonder how websites get those awesome icons that pop onto you homepage when ever you add a website to your iPhone or iPad’s home screen? Well, get ready to be blown away. Its the easiest graphic design you will ever do.

1. Open Photoshop and create a new 158 x 158 document.

2. Add your graphic/content to this new Photoshop document.

3. Save as apple-touch-icon.png.

4. Place the image in the root of your website’s hosting.

Apple will reform the image to create the rounded edges and center highlight automatically! (If you do not want these auto formats, save the image as apple-touch-icon-precomposed.png instead of the above image name.

If you want to use a different icon for every or maybe one or two separate pages, simply place this code in the <head> of the document (replace “path/myicon.png” with you images name and path:

<link rel="apple-touch-icon" href="path/myicon.png"/>

Pretty simple huh? and you thought it was going to be hard?

October 12th, 2012|DIY, Technology|
0
Connecting
Please wait...
Have a Question?

Apologies! We are not online right now. Please leave us a message and we'll get back to you, asap!

* Name
* Email
* Question
We're Online!

Questions? Lets Chat!

* Name
* Email
* Question
We're Online!
Feedback

Help us help you better! Feel free to leave us any additional feedback.

How do you rate our support?