How can I hide the url when my site is “added to home screen” on IOS?

I want the toolbar/url to ide when the site is added to Home Screen on iOS. An example of this is I will add a screenshot with a visual example of another site.

You need to turn your website into a Progressive Web App (PWA):

And use a meta tag for this:

How can I add a “meta tag”?

You add in the <head> section of your html, like:

<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
<meta name="apple-mobile-web-app-title" content="My App">

Still seems to lead to safari… Is there something else I need to change?

Did you create the manifest?

You can check tutorial on youtube this is a rapid one that sums it up what you need:

But there are more detailed PWA tutorial too.
(This video talks about service worker but that is optional)

Is there source code I can view? Also, will this require my repl to include node?

You can follow this guide:

I don’t have any code to this unfortanelly but the guide is pretty elusive

Thanks for your help. I followed this guide: How to build a PWA from scratch with HTML, CSS, and JavaScript

1 Like

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.