On iOS devices using the Safari browser, you are able to add a shortcut to your home screen to any site online. By default, these shortcuts will display as a screenshot of the website. This article will explain how to set an icon to your website so that when it is saved onto iOS home screens this will display instead.
Creating And Uploading Your Icon
The image for the shortcut must be 150x150 pixels in size. This will allow it to used across all iOS devices - those with regular displays and retina displays too!
Additionally, in order for the icon to work correctly, it must follow the following specifications:
Must be saved in .png format
Must be titled apple-touch-icon
Once you have created your icon, you can then upload it into the files area within your Create account (not the images area).
To upload the icon:
Log into your Create account
Click 'Content' from the top menu
Click 'Files' from the left-hand menu
Click the 'Add File' button
Follow the steps to upload your image
Adding The Icon To Your Site
Once you've uploaded the icon, you will need to add a small piece of code to the Custom <HEAD> of the page you would like to use the icon for - if you want to use it for any page that a shortcut is created for, you'll need to paste the code into each page individually. The code is below: