PWA install prompt

In a few seconds a custom build PWA banner will appear at the bottom of the viewport.

Feature check the web browser

• If the web browser natively supports installing PWA's this beforeinstallPrompt -event will be saved. And not executed yet.
• When our custom "Install our PWA app" -button is clicked it will feature test the web browser for this event.
• If the web browser does support this event the native PWA install prompt will be shown.
• If the web browser doesn't support this event: an alternative instruction text will be shown.
• When the PWA is already installed the banner will not be shown again using CSS Media Queries.

Code examples

Please review the install-pwa.js script. And this page's CSS file on how this works.

Test on mobile devices

Scan the QR-Code for the URL of this web page.