How to Get Add to Home Screen Pop Up on Site Open in Mobile Browser

No Add To Homescreen Pop-up in PWA

You are doing nothing wrong.

If you clear your cache and then use the app on your phone ( android / chrome browser) you will see Add to home screen prompt.

I tested on my phone , and I get the prompt.

PWA add to home screen not showing popup

The first step for Add to Home Screen (A2HS) automatic pop-up testing is using the lighthouse audit tools.

You need to run the PWA audit and correct warnings there until you see

--- "User can be prompted to install the Web App"

The lighthouse audit tools are available as a tab in the Chrome dev tools or as a Chrome extension.

The extension usually has the more current features.

Once you see that message you can test the automatic pop-up message on Chrome Desktop and Android (Chrome & Edge)

Important Things To Note

After you see it the first time, to see the pop-up again you will probably need to totally clear out your browser cache and for

Edge - delete the shortcut

Chrome Desktop - uninstall the app here: chrome://apps/

Crome Android - uninstall the WebApk in your applications

Once you know the automatic A2HS popup works you can then (if desired) intercept the automatic pop-up to make it less annoying to your users. Show them a button to let them know they can A2HS when convenient for them.

As described here

https://developers.google.com/web/fundamentals/app-install-banners/

Here is my tester for A2HS.

You will see the button show instead of the automatic pop-up.

Related Topics