You can use the Progressive Web App (PWA) to deliver an app-like experience for your mobile site visitors. This feature loads and responds to the user quicker (to feel like an app).
To activate the PWA, open up the site editor for the relevant site, select Settings from the left menu, and toggle this on.
Note: the PWA feature can only be activated on HTTPS sites.
Once this is activated, you can set the following details:
- Name: this is displayed on the splash screen, as well as the “add to home screen” message.
- Short name: this is displayed when there isn’t enough space for the name above (ensure you keep this short).
- Icon: this appears on the splash screen when page is loading, and is the icon that will be added to site user’s home screen.
- Background color: this is the color that shows when the site is loading.
Once this feature is activated and details set, when visiting your site on mobile the user will see “Add to Homesecreen” displayed. If they select to add, the icon you added above will be displayed on their device for quick access; they can re-enter the site using this icon even if their device is offline.
Tips and Troubleshooting
- PWA is supported on Chrome for Android.
- PWA caching is somewhat supported on iOS 11.3 (not “Add to homescreen”).