Add your PWA's Icon to a Home Screen

1. Android

1/ Add an image in the menu Design & Structure > Design > General Design > Icon :: PWA > Apple Touch Icon.
2/ Regenerate your PWA to link this image to your PWA.

Chrome browser will display an “Add to Home screen” popup automatically once your PWA is published and browsed by your users, as shown in the example below:

2. iOS

1/ Open the browser by tapping on the Safari icon.

2/ Navigate to the PWA url you wish to add as a home screen icon.

3/ Tap on the Share button at the bottom of the browser window. It's represented by a square with an up arrow in the foreground.

4/ The iOS Share Sheet will now appear, overlaying the main browser window. Select the option labeled "Add to home screen".

5/ The Add to Home interface should now be visible. You can edit the name that will be shown under the shortcut icon you are creating on your home screen.

6/ Once you are done, tap the "Add" button.

You will be taken back to your iPad/iPhone's home screen, which now contains a new icon mapped to your PWA.

Note: If you want to disable the pop-up, it is only possible for the Android version, by removing the Apple Touch Icon.

• Related Articles

• Head Tag | PWA

  In the menu Settings > Other Settings > Head tags, you can add HTML code to the head tag of your Progressive Web App (PWA). This code will be displayed on all your PWA pages. You can for instance add meta tags in this field to declare your PWA to ...

• Progressive Web App (PWA) Publication - General Information

  1. What is a Progressive Web APP (PWA)? Progressive Web Apps (PWA) can run on any device and have the capacity to totally adapt themselves to the screen they're being viewed on. PWA's are developed with web technologies and are accessible from all ...

• Make your PWA Private

  1. Set a Password Restriction to Access your PWA 1. Go to the menu Publish > PWA > Publish 2. Activate the password restriction 3. Fill in an explanatory message your visitor will see when reaching your PWA 4. Fill in the password that will be needed ...

• Popup and Permission Management

  Several popups or alerts need to be displayed when your users browse your PWA. Depending on your settings, your users could be asked for several authorizations: - Push notification - SMS notification - Install PWA to their device - Cookies - ...

• Cookies Warning

  Cookies are small files that are stored on a user's browser. The data that cookies store is usually some type of tracking information to help the website perform various tasks, such as managing a session ID when you sign in or tracking cookies if ...