...
It is the best way to choose if you have full access to your website, as the Capsule will always work right, independent of how complex your website is.
Adding PWA Capsule
After you name your app and dd an icon in Settings.
...
importScripts("https://cdn.mobsted.com/PWALessWorker.js");
Creating "App Saving" Prompts
These prompts are called widgets, you can have as many different saving points per each app as you want. It is recommended to have a specific app saving purpose for each.
...
Note that you can preview how this installation prompt will look on your right → hand side.
Adding "App Saving" Prompts to your Website
An example - Simple Button
Show this app saving widget when a user presses a certain button, in this case, "Install App" button.
...
You can call these widgets anyway you see fit, for example, based on user actions (like a button) or using timers and as a part of a workflow, like "Something is added to a shopping cart"
An example - Auto Hiding Button
It is the same button, but it will hide if a user visits your website and already has the application installed.
...
NOTE - the attribute "pwaless" will work just as well on any other HTML element, as it does on buttons.
Recommended Use
It makes sense to keep show off the "App Saving" abilities of your website visible, so people can share it, in places like the bottom block of your website. So do not add the "pwaless" attribute.
...
But, for pop-ups, notification bars, site menus, and logic-related prompts (like saving after a purchase is made) it is recommended to use the Auto Hiding function.
Final Check List for your website
Now you should have:
- Added JS snippet to header or footer
- Added 2 JS files from archive to root
- Added a call of the app saving widget/prompt
...