apple-mobile-web-app-capable just not working for me

Question

RyuMaster OP

Created Feb ’16

Replies 3

Boosts 0

Views 25k

Participants 4

I am tearing my hair, because it is not working no matter what. I have:

<meta name="mobile-web-app-capable" content="yes"> 
<meta name="viewport" content="initial-scale=1"> 
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent"> 
<link rel="apple-touch-icon" sizes="192x192" href="/test/icon.png"> 
<link rel="manifest" href="manifest.json">

all defined properly. Then I use 'Add to Home' button, testing it on all iPhones using crossbrowser live test website. And I never get that fullscreen experience. The launch icon is always being created on home screen, with proper icon, but it launches just ordinary website all the time, on every iOS version;

Any advice, on what I might be missing? Website test url is: http://gostopworld.com/test/index.html

I tried with/without manifest file, all the same, no difference.

Boost

Answer 1

madhouse OP

Feb ’16

It's been removed. See here:

http://stackoverflow.com/questions/24889100/ios-8-removed-minimal-ui-viewport-property-are-there-other-soft-fullscreen

0

Answer 2

Vetter OP

Sep ’16

I had the same challenge trying to make my web site display in full screen when launching from a tile using the meta tag, no luck, and then I found this post and it works now with the added script from the link.

https://gist.github.com/irae/1042167

Another meta tag that I like that does still work is below: (with this tag, the title of my web page can be different than the title of the tile when the user saves it to the home screen on their device)

All the best,

0

Answer 3

wmcb91 OP

Feb ’22

To those stumbling upon this thread now, the way to get a true full screen experience with a PWA on iOS by adding the following to your manifest.json file

{
  ...
  "display": "standalone",
  "orientation": "portrait",
  ...
}

2