Skip to content

Updating visuals

If you see any images containing outdated UI, please bear with us.

We are updating all content as quickly as possible to mirror our new UI.

Mobile app (PWA)

What is a PWA

A Progressive Web App (PWA) is an application built using web technologies that provides a user experience similar to a native mobile app.

  • Web access — Like a website, a PWA can be accessed through web browsers
  • Installation — Like a mobile app, a PWA can be installed on a device such as a phone, tablet, or computer
  • App-like experience — Once installed, the PWA behaves like a native app with its own icon on the home screen

Accessing PWA settings

To configure PWA settings for your WeWeb app:

  1. Open the Settings tab in the top bar and click Interface Settings
  2. Click Mobile app (PWA)

This opens the PWA configuration modal.

Enabling mobile app features

To allow users to install your WeWeb app on their devices:

  1. Open the PWA settings
  2. Toggle Enable Mobile App (PWA) to Enable
  3. Configure the following required settings:

App name

The name that will appear under the app icon on the user's home screen.

TIP

Keep the app name short — 12 characters max is recommended for optimal display on mobile devices.

App icon

The icon that will be displayed on the device's home screen.

TIP

Use an icon that is at least 512x512 pixels for best quality across all devices.

Theme color

The color of the browser UI when your PWA is opened. This affects the status bar and address bar on mobile devices.

Learn more about theme color on MDN →

Background color

The background color shown while the app is loading, before the content appears.

Learn more about background color on MDN →

Display mode

Choose how the app will be displayed when opened from the home screen:

  • Full screen — The app takes up the entire screen, hiding all browser UI
  • Standalone — The app looks like a native app, with no browser UI but system UI visible
  • Minimal UI — Similar to standalone but with minimal browser navigation controls
  • Browser — The app opens in a normal browser tab

Learn more about PWA display modes on MDN →

TIP

Most PWAs use Standalone mode for the best app-like experience while maintaining access to system notifications and status.

Publishing

Once you have configured all the required settings, publish your WeWeb app to make it installable.

Disabling mobile app features

If you need to disable the PWA features of your WeWeb app:

  1. Open the PWA settings
  2. Toggle Enable Mobile App (PWA) to Disable
  3. Publish your WeWeb app

When you disable PWA features:

  • The project will be published without a PWA manifest and service worker
  • The published app unregisters all service workers
  • Users will no longer be able to install the app on their devices
  • The app will only be accessible via a web browser

Custom manifest or service worker

If you need to replace WeWeb's default PWA files, upload them in InterfaceAssetsFiles and set these paths:

  • /manifest.json For a custom PWA manifest
  • /serviceworker.js For a custom service worker

PWA must stay enabled. If PWA is disabled, the published app unregisters all service workers, including a custom one.

Learn more about project files →

How users install your PWA

Once you've enabled and published PWA features, users can install your app on their devices.

Installation process

To install your WeWeb app, users need to:

  1. Open your app in a web browser on their device
  2. Follow their browser's installation prompts
  3. Save the app to their home screen

When they tap the app icon, it launches like a native mobile app.

Device-specific instructions

The installation process varies by device and browser. Here are common examples:

iOS (iPhone/iPad)

  1. Browse to your app in Safari
  2. Tap the Share icon
  3. Select Add to Home Screen
  4. Confirm the installation

Android

  1. Browse to your app in Chrome
  2. Tap the Install banner or menu option
  3. Follow the on-screen prompts
  4. The app icon will appear on your home screen

Desktop (Chrome/Edge)

  1. Browse to your app
  2. Click the install icon in the address bar
  3. Confirm the installation
  4. The app will open in its own window

Updating a PWA

PWAs automatically update when you publish new versions of your WeWeb app:

  1. Publish a new version — Use WeWeb's publish feature as normal
  2. Automatic version check — When users open the installed app, it automatically checks for updates
  3. Latest version loads — The most recent published version displays to users

No action is required from you or your users to update an installed PWA. This is standard PWA behavior.

TIP

Users don't need to manually update your PWA from an app store. Updates happen automatically, which makes maintenance easier and ensures users always have the latest version.

CONTINUE LEARNING

Learn about managing other app settings:

Learn about redirections →