Installation Widget

Customize how your PWA installation prompt appears across devices using floating buttons, banners, or custom-targeted components. These features enhance the native install experience by providing clear entry points for users to add your app to their home screen.

Floating Install Button

A fixed-position install button that floats on the screen and prompts installation when clicked.

Options:

Enable Floating Button: Toggle on/off visibility
Position: Choose from Bottom Right, Bottom Left, Top Right, or Top Left
Display On: Desktop only, Mobile only, or both
Background Color: Customize the button’s background
Icon (SVG): Optional icon to visually represent install action

This button is rendered across all supported pages when beforeinstallprompt is available and is ideal for passive but visible install promotion.

Installation Banner

Displays a persistent install banner at the top of the page. This is useful for non-intrusive promotion without occupying floating space.

Options:

Enable Banner: Enable/disable the install banner
Display On: Choose target devices (Desktop, Mobile, or both)
Banner Text: Short message to encourage installation (e.g., “Install our app for quick access”)
Button Color: Style the call-to-action button
Icon (SVG): Optional image displayed alongside text

Custom Install Button 🔒 Premium

Allows developers to define and style their own install button anywhere in the DOM by assigning a specific ID.

Options:

Enable Custom Button: Turns on custom button handling
Button ID: The DOM id of the button element you’ve implemented (e.g., install-button)

Example:


<button id="install-button">Install App</button>