Add to Home Screen icon not populating on Ipad with ios 9.1 on safari browser

Question

I have used below lines of code to populate the Add to home screen icon but it still gives an image of the entire page while clicking on add to home screen icon.

    <link rel="apple-touch-icon-precomposed" href="/apple-touch-icon-precomposed.png"/>
    <link rel="apple-touch-icon" sizes="57x57" href="/apple-touch-icon-57x57.png"/>
    <link rel="apple-touch-icon" sizes="72x72" href="/apple-touch-icon-72x72.png"/>
    <link rel="apple-touch-icon" sizes="114x114" href="/apple-touch-icon-114x114.png"/>
    <link rel="apple-touch-icon" sizes="144x144" href="/apple-touch-icon-144x144.png"/>

I am sure the path to this images are correct.

I have tried almost every solution available on internet including this website but don't seem to get it working. Please let me know in case if any other information needs to be provided.

https://developer.apple.com/library/ios/documentation/AppleApplications/Reference/SafariWebContent/ConfiguringWebApplications/ConfiguringWebApplications.html#//apple_ref/doc/uid/TP40002051-CH3-SW4

Any points of assistance would be of immense help.

Underfoot

Without testing anything yet did you try just the basic of assigning an image to the whole website using these instructions: To specify an icon for the entire website (every page on the website), place an icon file in PNG format in the root document folder called apple-touch-icon.png – Navy

Answer 1

I could not populate the image in Add to Home Screen option due to https certificate issue.Though i could browse the images using the path of the image but surprisingly it did not populate the home screen image on ipad.

Would like to get few answers on how to debug on safari browser from within the ipad.

I added a new certificate for the device and the add to home screen icon image started appearing as intended.

Underfoot

Also in case if you want to check if https is really the one causing the issue.You can try changing the httpd.conf file and look for word "LISTEN" .Then change the 443 to 80 and restart apache. By this your server is now listening to http. Try to add an icon to home screen if it works well then the chances are very high that it is a certificate issue. – Underfoot

Answer 2

Be sure that you're not on a dev server or on a site that you need to obtain a certificate for. I ran into a similar issue and was finally resolved by moving assets onto production srvr.

I tested on physical (live) devices and also using BrowserStack to reach those devices and browsers I didn't have and everything worked as expected.

Aestheticism