4

I have a multi page website. I add it to home screen in iPhone using "add to home screen" button in Share menu.

When I open it using the icon in the home screen, the website shows full screen. But when I go to any sub-page with a different route, like example.com/page, I see gray bars at the top and bottom, showing the address, navigation back and forward, "Done" button, share button, open in safari button.

How can I make it display full screen all the time? Changing routing to use # is not an option. It worked at some point in the past, but I had to remove the app, and can't make it work again

Vladimir Mikhaylovskiy
  • 1,955
  • 4
  • 19
  • 28
  • hmm are you using an pwa? there should be an manifest file where you can set the screen to fullscreen https://developer.mozilla.org/en-US/docs/Web/Manifest/display – bill.gates Sep 09 '20 at 08:47

1 Answers1

5

I figured it out myself, it turns out that recently I removed manifest.json from the html file. Adding it back solved the problem! Also, I found this page helpful in figuring out how manifest works https://web.dev/add-manifest/

Vladimir Mikhaylovskiy
  • 1,955
  • 4
  • 19
  • 28