Tutorial - Add to Home Screen Dialog

Help your users to install their PWA on their devices

...

By Thorium Builder Team - November 2020

The Add to Home Screen dialog has been improved with Thorium Builder version 2.0, we will learn in this short tutorial how to implement the new dialog layout.

If you want to know more about PWA installation requirements, you can read also this tutorial:  https://www.thoriumbuilder.com/_help/tuthorium/pwainstallation/

Getting Started

In order to edit the dialog settings, open the project settings and select the PWA tab:

...

The available options are the following ones:

Result

The dialog won’t be displayed with the simulator and neither with desktop Navigator, it will be displayed to the user only when running the App on Safari / iOS or Chrome/Android.

...

Add to Home Screen in White mode

...

Add to Home Screen in Dark mode

Note: the App background is disabled with a backdrop, the user has no other choice than installing the App or Select the “Install Later” button (if the option “Skip Button” is activated.

Once the App Installed (Added to Home Screen) , this dialog won’t popup anymore.

Note that if your project is only to build a Native App, then this functionality is not useful (and will be deactivated by default in Native Apps)

...