> ## Documentation Index
> Fetch the complete documentation index at: https://moengage.com/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# Configure Web Push Settings

> Set up web push notification settings in MoEngage, including default icons, subdomains, notification opt-in prompts, and multi-project support.

This article describes the steps to configure the Web Push Settings.

1. Navigate to **Settings > Channels > Push > Web Push**.
2. It consists of two sub-sections, **Configure** and **Notification Opt-in**.

<Tip>
  For a [Portfolio](/user-guide/settings/account/portfolio/portfolio)-enabled workspace, before configuring Web Push settings, you must add at least one project to your MoEngage [Portfolio](/user-guide/settings/account/portfolio/portfolio). For more information on how to add a project, refer [here](/user-guide/settings/account/portfolio/portfolio).
</Tip>

# Project selection

If your portfolio has multiple projects, a dropdown appears at the top of the **Web push** settings tab. Select the project you want to configure from the dropdown menu. The related settings (such as the default notification icon) load automatically. For portfolios with a single project, all settings are appended to that project.

# Icons and Sub-domains

**Configure**

<img src="https://mintcdn.com/moengage/fVqFKGn_bbcOn3ck/images/moengage_256757.png?fit=max&auto=format&n=fVqFKGn_bbcOn3ck&q=85&s=c3706638f103580c5ce74aaede12ac8f" alt="webpushsettingspic.png" width="2094" height="1256" data-path="images/moengage_256757.png" />

You can configure the default push icon, subdomains, and badges to be used for Web Push, as shown in the table below. For more information on preference management for push notifications, refer [here](/user-guide/campaigns-and-channels/mobile-push/getting-started-with-mobile-push/preference-management-for-push-notifications).

| Field                           | Description                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                              |
| ------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Project                         | Select the preferred project from the dropdown menu. This field appears if you have configured more than one project on your portfolio. For more information, refer [here](/user-guide/settings/account/portfolio/portfolio).                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                            |
| 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: <ul><li>**Upload image** Choose the *Upload Image* radio button and click the *Browse and Upload* button to upload the image from your device.</li><li>**Enter Image URL** Choose the *Enter Image URL* radio option and type or paste the image URL for the badge icon for your app.</li></ul> MoEngage supports the following file types to be uploaded for the Badge Icon image: .png, .gif, .webp, .ico, .cur, and .bmp. <br /><img src="https://mintcdn.com/moengage/8EX_gHAg3q4zA1kw/images/moengage_24b8ee.png?fit=max&auto=format&n=8EX_gHAg3q4zA1kw&q=85&s=02cafe93986aeac9202b402eae5c2d4f" width="2112" height="1380" data-path="images/moengage_24b8ee.png" /><br /><Info>                                 <ul><li>Only Alpha Channel (black & white) images are supported.</li><li>RGB images are not supported.</li><li>The recommended resolution for the Badge Icon is 72x72 pixels or larger.</li></ul>                                                   </Info> |
| Sub-domains                     | This field denotes the subdomains for your website and has the following options: <ol><li>*Treat each subdomain as a separate entity* - If you have multiple sub-domains, they will all be treated as separate entities, and users will be asked for permissions in each one of them.</li><li>*Track user cross-domain* - If you have multiple subdomains and want to use the same Dashboard to track, choose Track user cross-domain.</li></ol>                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                         |

# 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.

* Select the preferred project from the **Project** dropdown. This field appears if you have configured more than one project on your portfolio. For more information, refer [here](/user-guide/settings/account/portfolio/portfolio).
* To enable this feature, you must enable the Web Push opt-in under the **Notification opt-in** tab.

<img src="https://mintcdn.com/moengage/ncl4TtlD4tqnPefh/images/moengage_7552a0.png?fit=max&auto=format&n=ncl4TtlD4tqnPefh&q=85&s=6299fa6bae66e96664aaba93b981fd8b" alt="" width="1298" height="444" data-path="images/moengage_7552a0.png" />

* MoEngage provides three types of push opt-in:
  * Two-Step Opt-In (Recommended)
  * 1-Click Opt-In
  * Self Handled Opt-in

<Tabs>
  <Tab title="Two-Step Opt-in (Recommended)">
    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              | <ul><li>Banner/ Nudge Icon</li><li>Accessibility text</li><li>Banner/ Nudge Background Color</li><li>Banner/ Nudge Text</li><li>Banner Text Color</li><li>Allow Button</li><li>Dismiss Button</li></ul> **Note**: For more information on Accessibility, refer [here](/user-guide/campaigns-and-channels/getting-started/campaign-content/accessible-campaigns-in-moengage). |

    <img src="https://mintcdn.com/moengage/wjYnJKL0xml-g3HM/images/moengage_45038c.png?fit=max&auto=format&n=wjYnJKL0xml-g3HM&q=85&s=96d162b5b7a1e3ef44d7f6d6b83989dd" alt="" width="2238" height="3102" data-path="images/moengage_45038c.png" />
  </Tab>

  <Tab title="1-Click Opt-in">
    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.                                                                         |

    <img src="https://mintcdn.com/moengage/tNrQQROY8O0h4yWe/images/moengage_15f19e.png?fit=max&auto=format&n=tNrQQROY8O0h4yWe&q=85&s=2d31c284db154c482098db0b6cb34f01" alt="" width="2240" height="2488" data-path="images/moengage_15f19e.png" />

    <Info>
      For Safari

      * The *Show Push Permission Opt-in after* value is ignored.
      * The opt-in is triggered on the *click* event as against page load.
    </Info>

    <Warning>
      One-Click Opt-In

      * does not work on newer versions of Microsoft Edge.
      * does not render the Hard-ask completely on Safari when the user clicks any link on the webpage. This is because the opt-in is triggered on the *click* event as against page load.
    </Warning>
  </Tab>

  <Tab title="Self-Handled 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](https://www.moengage.com/docs/developer-guide/web-sdk/web-push/configure-self-handled-opt-in).

    <img src="https://mintcdn.com/moengage/2FjM3dGfEH1CYo8k/images/moengage_62943e.png?fit=max&auto=format&n=2FjM3dGfEH1CYo8k&q=85&s=61e9c3083a99fc7359e59cf657d7c83a" alt="" width="2204" height="684" data-path="images/moengage_62943e.png" />

    <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.
    </Warning>
  </Tab>
</Tabs>

<Info>
  **Caching**: All of the above settings take a minimum of 24 hours to reflect on your website.
</Info>

# 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>
  For web push to work on Safari for iOS devices, the following is required:

  * Your website must be a Progressive Website App (PWA).
  * A web app manifest file must be created and linked.
  * The MoEngage service worker file should be imported and placed in the root folder.
  * The PWA must be added to the Home Screen.
  * The user should be prompted for permission to receive web push notifications. We recommend a two-step opt-in process.

  For more information, refer to the [Web Push Integration Steps for Safari on iOS and iPadOS](https://www.moengage.com/docs/developer-guide/web-sdk/web-push/safari-web-push-for-i-os-and-i-pad-os).
</Info>

# Preview for various OS/Browser combinations

<Tabs>
  <Tab title="Android">
    <Accordion title="Chrome">
      <img src="https://mintcdn.com/moengage/Ci8j4F7VOEUnUuwd/images/moengage_ed2176.png?fit=max&auto=format&n=Ci8j4F7VOEUnUuwd&q=85&s=cbecb319392da2e8618aadc169b5351a" alt="mceclip2.png" style={{ width:"39%" }} width="684" height="770" data-path="images/moengage_ed2176.png" />
    </Accordion>

    <Accordion title="Firefox">
      <img src="https://mintcdn.com/moengage/7H2dU4CG2W0DQCPI/images/moengage_6e9d01.png?fit=max&auto=format&n=7H2dU4CG2W0DQCPI&q=85&s=9f3b1ba0fbb1d394f96e39fcc5390e28" alt="mceclip3.png" style={{ width:"42%" }} width="514" height="145" data-path="images/moengage_6e9d01.png" />
    </Accordion>

    <Accordion title="Opera">
      <img src="https://mintcdn.com/moengage/jnaevUpPOwD04mEl/images/moengage_83fb7b.png?fit=max&auto=format&n=jnaevUpPOwD04mEl&q=85&s=75fa5e01290ffa9af0803aa75ad38713" alt="mceclip4.png" style={{ width:"37%" }} width="684" height="770" data-path="images/moengage_83fb7b.png" />
    </Accordion>

    <Accordion title="Edge">
      <img src="https://mintcdn.com/moengage/cFTwc93vQdTanvKi/images/moengage_bd8cb0.png?fit=max&auto=format&n=cFTwc93vQdTanvKi&q=85&s=b907edab38def30eb39c801e04ba2c34" alt="android_edge__1_.png" style={{ width:"39%" }} width="1368" height="1540" data-path="images/moengage_bd8cb0.png" />
    </Accordion>
  </Tab>

  <Tab title="Linux">
    <Accordion title="Chrome">
      <img src="https://mintcdn.com/moengage/4hNKOAjPrnhpJB2_/images/moengage_7febb4.png?fit=max&auto=format&n=4hNKOAjPrnhpJB2_&q=85&s=d87fa8899ef4fdf911c6796533e08b93" alt="mceclip5.png" style={{ width:"55%" }} width="500" height="151" data-path="images/moengage_7febb4.png" />
    </Accordion>

    <Accordion title="Firefox">
      <img src="https://mintcdn.com/moengage/fVqFKGn_bbcOn3ck/images/moengage_228465.png?fit=max&auto=format&n=fVqFKGn_bbcOn3ck&q=85&s=282e6370d1c096cc4aaf44acaf59da14" alt="mceclip6.png" style={{ width:"64%" }} width="500" height="76" data-path="images/moengage_228465.png" />
    </Accordion>

    <Accordion title="Opera">
      <img src="https://mintcdn.com/moengage/2CGhjk8ZDWEC5ocb/images/moengage_f61e4f.png?fit=max&auto=format&n=2CGhjk8ZDWEC5ocb&q=85&s=8110ce182b3cb4863ce68c618bcbeea5" alt="linux_opera.png" style={{ width:"65%" }} width="2000" height="600" data-path="images/moengage_f61e4f.png" />
    </Accordion>

    <Accordion title="Edge">
      <img src="https://mintcdn.com/moengage/2CGhjk8ZDWEC5ocb/images/moengage_f61e4f.png?fit=max&auto=format&n=2CGhjk8ZDWEC5ocb&q=85&s=8110ce182b3cb4863ce68c618bcbeea5" alt="linux_edge.png" style={{ width:"66%" }} width="2000" height="600" data-path="images/moengage_f61e4f.png" />
    </Accordion>
  </Tab>

  <Tab title="Mac">
    <Accordion title="Chrome">
      <img src="https://mintcdn.com/moengage/cFTwc93vQdTanvKi/images/moengage_be42c2.png?fit=max&auto=format&n=cFTwc93vQdTanvKi&q=85&s=9bb2bada813a56752b18f09adbf0d5da" alt="mceclip8.png" style={{ width:"37%" }} width="344" height="370" data-path="images/moengage_be42c2.png" />
    </Accordion>

    <Accordion title="Firefox">
      <img src="https://mintcdn.com/moengage/E3HJVtaUzhrzFckK/images/moengage_93efa1.png?fit=max&auto=format&n=E3HJVtaUzhrzFckK&q=85&s=eb8c09089752758f9bc272b11f1eed6f" alt="mceclip9.png" style={{ width:"36%" }} width="344" height="399" data-path="images/moengage_93efa1.png" />
    </Accordion>

    <Accordion title="Opera">
      <img src="https://mintcdn.com/moengage/0iWkm50wROjmHH3Z/images/moengage_d14d0c.png?fit=max&auto=format&n=0iWkm50wROjmHH3Z&q=85&s=7e3e3287ff07b8d01b7c23905ebcfa33" alt="mceclip10.png" style={{ width:"36%" }} width="344" height="370" data-path="images/moengage_d14d0c.png" />
    </Accordion>

    <Accordion title="Safari">
      <img src="https://mintcdn.com/moengage/rlD8iAX6JQFx0hql/images/moengage_bc6b93.png?fit=max&auto=format&n=rlD8iAX6JQFx0hql&q=85&s=6e7f81cc7a26a0d8d55def569e0e0c49" alt="mceclip11.png" style={{ width:"54%" }} width="344" height="69" data-path="images/moengage_bc6b93.png" />
    </Accordion>

    <Accordion title="Edge">
      <img src="https://mintcdn.com/moengage/CaPmX0z_ys8cr0ms/images/moengage_099e2a.png?fit=max&auto=format&n=CaPmX0z_ys8cr0ms&q=85&s=173c014eececae090cfc18f279b3e940" alt="mac_edge.png" style={{ width:"45%" }} width="1376" height="1480" data-path="images/moengage_099e2a.png" />
    </Accordion>
  </Tab>

  <Tab title="Windows">
    <Accordion title="Chrome">
      <img src="https://mintcdn.com/moengage/Ci8j4F7VOEUnUuwd/images/moengage_eabd6f.png?fit=max&auto=format&n=Ci8j4F7VOEUnUuwd&q=85&s=a8ec10538e25743f402fa5e279b9ec60" alt="mceclip12.png" style={{ width:"37%" }} width="453" height="494" data-path="images/moengage_eabd6f.png" />
    </Accordion>

    <Accordion title="Firefox">
      <img src="https://mintcdn.com/moengage/7H2dU4CG2W0DQCPI/images/moengage_6ef162.png?fit=max&auto=format&n=7H2dU4CG2W0DQCPI&q=85&s=f764219e4f55264752bc133fcdda80c9" alt="mceclip13.png" style={{ width:"47%" }} width="954" height="292" data-path="images/moengage_6ef162.png" />
    </Accordion>

    <Accordion title="Opera">
      <img src="https://mintcdn.com/moengage/2CGhjk8ZDWEC5ocb/images/moengage_f73b99.png?fit=max&auto=format&n=2CGhjk8ZDWEC5ocb&q=85&s=02fd33fef25e6f5c123002905416f956" alt="mceclip14.png" style={{ width:"37%" }} width="453" height="494" data-path="images/moengage_f73b99.png" />
    </Accordion>

    <Accordion title="Edge">
      <img src="https://mintcdn.com/moengage/P9B7WlDoMUnquME5/images/moengage_0aaf5c.png?fit=max&auto=format&n=P9B7WlDoMUnquME5&q=85&s=ad1ed1d5480c3d0bebc85e63e0ff728d" alt="windows_edge.png" style={{ width:"36%" }} width="1812" height="1976" data-path="images/moengage_0aaf5c.png" />
    </Accordion>
  </Tab>

  <Tab title="iOS">
    <Accordion title="Safari">
      <img src="https://mintcdn.com/moengage/ME-DtlELD2N8TrcF/images/moengage_c07bdd.png?fit=max&auto=format&n=ME-DtlELD2N8TrcF&q=85&s=17ac48dfea29d2b833ad3b3afee0b92e" alt="image.png" style={{ width:"53%" }} width="585" height="100" data-path="images/moengage_c07bdd.png" />
    </Accordion>
  </Tab>
</Tabs>

# Device Analytics

Under the **Device analytics** tab, you can configure your tracking preferences to refine your reporting. This includes:

* **App Version Buckets:** Grouping versions into buckets (e.g., Beta vs. Stable) to analyze adoption trends.
* **OEM & Browser Tracking:** Selecting the top 5 device manufacturers or browsers most relevant to your users, while grouping the rest under "Others."

For detailed steps on configuring these preferences, refer to [Device Analytics Configuration](/user-guide/campaigns-and-channels/mobile-push/getting-started-with-mobile-push/device-analytics-configuration).

# Whitelist IPs

If your system requires IP whitelisting for using Content API or PII tokenization in Push campaigns, refer [here](/user-guide/settings/account/security/ip-whitelisting-in-moengage).

# Frequently Asked Questions

<Accordion title="Can I choose where web push notifications appear on the screen? ">
  The position of web push notifications on the screen varies and depends on the browser and operating system. They may appear in a notification center or as a pop-up and cannot be customized.
</Accordion>