Search code examples
htmlioswebweb-applicationshomescreen

IOS Devices add website to homescreen as web app not shortcut

I am trying to find the correct way to code a similar site that would allow the user to add it to their homescreen. Then when opened it would open not as a shortcut to safari but as a web app of its own. You can see this in the fedex example below. You can see I have both safari and the web app open at one time. The web app has no address bar or safari navigation. enter image description hereenter image description here

Please direct me to what this is called as I can not find information on how to achieve this on iOS

Solution

  • You need to follow Apple guide

    I wanted to give here a brief but it's very long so please read the parts that interesting you.

    You have there how to configure the icons, launch screen, title

    About what you asked to hide safari controls just use this:

    <meta name="apple-mobile-web-app-capable" content="yes">

    And this is your way to check in runtime if the user now in standalone mode (so you won't ask him to download again) 

    window.navigator.standalone

    Good luck!