| info |
Information We've revamped our dashboard settings. This article describes the steps to configure the Web Push Settings in the revamped settings UI and the older UI. |
- Navigate to Settings > Channels > Push > Web Push.
- It consists of two sub-sections, Configure and Notification Opt-in.
- Navigate to Settings > Channels > Push > Web Push.
- It consists of two sub-sections, Web Push Settings and Notification Opt-in Configuration.
Icons and Sub-domains
Configure
You can configure the default push icon, subdomains, and badges to be used for Web Push, as shown in the table below.
| Field | Description |
|
Default Notification Icon |
This field contains the icon that would be used in the Web Push notification. The MoEngage icon is the default icon. You can change this by uploading your Brand’s logo. |
|
Badge Icon for Android Web Push |
For Android devices receiving Web Push, the badge icon is the app icon available at the top section on the left in the push notifications. Two options are available for uploading the badge icon:
MoEngage supports the following file types to be uploaded for the Badge Icon image: .png, .gif, .webp, .ico, .cur, and .bmp. Note:
|
|
Sub-domains |
This field denotes the subdomains for your website and has the following options:
|
Web Push Settings
You can configure the default push icon, subdomains, and badges to be used for Android Mobile Push, as shown in the table below.
| Field | Description |
|
Default Push Icon |
This field contains the icon that would be used in the Web Push notification. The MoEngage icon is the default icon. You can change this by uploading your Brand’s logo. |
|
Subdomains |
This field denotes the subdomains for your website and has the following options:
|
|
Badge Icon for Android Mobile Push |
The badge icon is the app icon available at the top section on the left in the push notifications. This option is currently available only for Android Devices. Two options are available for uploading the badge icon for Android mobile push notifications in the MoEngage Dashboard.
MoEngage supports the following file types to be uploaded for the Badge Icon image: .png, .gif, .webp, .ico, .cur, and .bmp. Note:
|
Notification Opt-in Configuration
You can configure the Web Push Opt-In information in this section. Opt-In refers to how push permission is sought from the users on your webpage.
To enable this feature, you must enable the Web Push opt-in under the Notification opt-in tab.
MoEngage provides three types of push opt-in:
-
-
- Two-Step Opt-In (Recommended)
- 1-Click Opt-In
- Self Handled Opt-in
-
The Two Step opt-in is the recommended option as it is a soft ask. Soft ask means the option is displayed multiple times even if the user does not allow it and this will maximize your reachable users.
On the web page, users are asked a "soft ask" that gauges user preference and proceeds to show the main browser permission upon permission.
The Two Step Opt-in section has the following options:
| Field | Description |
| Show Push Permission opt-in after |
You can configure the time after which to show the push permission opt-in to the user. |
| Show Desktop Banner / Mobile Nudge after |
You can configure the time after which to show the desktop banner/ mobile nudge to the user. |
| Opt-In re-appear time | In case the users close the opt-in or banner/nudge, you can configure the time after which to show the opt-in again to the user. |
| Hide Moengage Branding | You can hide the MoEngage logo appearing on the soft ask and hard ask. |
| Desktop Banner/Mobile Nudge |
|
New UI:
Old UI:
The 1-Click Opt-in section has the following options:
| Field | Description |
| Opt-In re-appear time |
In case the users close the opt-in or banner/nudge, you can configure the time after which to show the opt-in again to the user. |
| Hide Moengage Branding | You can hide the MoEngage logo appearing on the soft ask and hard ask. |
| Show Push Permission Opt-in after | You can configure the time after which the users will see the Push permission opt-in. |
| Use Assistive Overlay to increase opt-ins | This will automatically nudge the users to opt-in for your push notifications. You can also edit the assistive overlay text. |
|
Push Opt-in Preview (Click on text to edit) |
You can view and edit the text of the Push opt-in nudge. |
New UI:
Old UI:
| info |
Note For Safari
|
| warning |
Warning One-Click Opt-In
|
The Self Handled Opt-in can be enabled only with Web SDK Integration. For information about configuring Self-Handled Opt-In, refer to Configure Self-Handled Opt-In.
New UI:
Old UI:
| warning |
Warning With Microsoft Edge, Hard-ask on page load does not get rendered using the Self-Handled Opt-In. Hence, it is recommended to invoke Soft-ask first. |
| info |
Note Caching: All of the above settings take a minimum of 24 hours to reflect on your website. |
Browser Compatibility Matrix
| Operating System | Browser | Web Push Support | Onsite Messaging Support |
|---|---|---|---|
| Windows |
Internet Explorer |
❌ |
❌ |
| Windows |
Google Chrome |
✅ |
✅ |
| Windows |
Mozilla Firefox |
✅ |
✅ |
| Windows |
Opera/ Opera Neon |
✅ |
✅ |
| Windows |
Chromium Edge |
✅ |
✅ |
| Mac OS |
Google Chrome |
✅ |
✅ |
| Mac OS |
Mozilla Firefox |
✅ |
✅ |
| Mac OS |
Opera/ Opera Neon |
✅ |
✅ |
| Mac OS |
Chromium Edge |
✅ |
✅ |
| Mac OS |
Safari |
✅ (macOS 13 or higher) |
✅ |
| Android |
Google Chrome |
✅ |
✅ |
| Android |
Mozilla Firefox |
✅ |
✅ |
| Android |
Samsung Internet |
✅ |
✅ |
| Android |
UC browser |
✅ |
✅ |
| iOS |
Google Chrome |
❌ |
✅ |
| iOS |
Safari |
✅ (Both iOS and Safari 16.4+) |
✅ |
| info |
Note For web push to work on Safari for iOS devices, the following is required:
For more information, refer to the Web Push Integration Steps for Safari on iOS and iPadOS. |