---
title: "Getting Started with Web Push"
slug: "getting-started-with-web-push"
updated: 2025-08-28T14:22:52Z
published: 2025-08-28T14:22:52Z
canonical: "docs.mapp.com/getting-started-with-web-push"
---

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

# Getting Started with Web Push

## Introduction

Web Push lets you reach website visitors directly in their browsers, improving reach and engagement with timely, permission-based notifications. It works with or without Mapp Intelligence, and can be implemented via Tag Integration or JavaScript.

[Process Flow Web push.mp4](https://player.vimeo.com/video/743107919?h=d1e9066941&badge=0&autopause=0&player_id=0&app_id=58479)

---

## Prerequisites

- Web Push is enabled on your website
- Firebase account for push message delivery
- Website JavaScript integration, including a Service Worker
- Authorized SSL certificate for secure communication
- *(Optional)* Mapp Intelligence account if you want to track engagement
- Web Push is activated in your Mapp Engage account. Contact your Customer Success Manager or Account Manager to enable this feature.
- Customer opt-in is required for displaying notifications.
- Device registration with the Firebase Push service is necessary before receiving Web Push messages.

> [!NOTE]
> Please note you will need to speak with your Account Manager about setting up Web Push in your account.

---

## High-level Workflow

### 1 Technical Setup

#### 1.1 With Intelligence

Use this setup if your website has Mapp Intelligence so that engagement with Web Push is tracked.

| Documentation | Description |
| --- | --- |
| [Step 1: Configuration Firebase and Service Worker](/v1/docs/step-1-configuration-firebase-and-service-worker) | Configure Firebase and the Service Worker, which are the base for messaging. |
| [Step 2: Configuring and Activating the Web Push Plugin](/v1/docs/step-2-configuring-and-activating-the-web-push-plugin) | Configure and activate the Web Push plugin. |
| [Step 3: Set up in Mapp Engage](/v1/docs/step-3-set-up-in-mapp-engage) | Set up the channel in Mapp Engage. |

#### 1.2 Without Intelligence

Use this setup if you are not using Mapp Intelligence.

| Documentation | Description |
| --- | --- |
| [Step 1: Configuration Firebase and Service Worker](/v1/docs/intelligence-step-1-configuration-firebase-and-service-worker) | Configure Firebase and the Service Worker. |
| [Step 2: Configuring and Activating the Web Push Script](/v1/docs/step-2-configuring-and-activating-the-web-push-script) | Configure and activate the Web Push script on your page. |
| [Step 3: Login of the user](/v1/docs/step-3-login-of-the-user) | Implement the user login call when a visitor lands on your site. |
| [Step 4: Set up in Mapp Engage](/v1/docs/step-4-set-up-in-mapp-engage) | Set up the channel and prepare a message in Mapp Engage. |

---

### 2 Create a Web Push Notification

After the technical setup, create your notification in Mapp Engage. Use cases provided in the documentation include:

| Documentation | Description |
| --- | --- |
| [Send an Abandoned Cart Reminder via Web Push](/v1/docs/send-an-abandoned-cart-reminder-via-web-push) | Use cases for inspiration |
| [Send a Flash-Sale Announcement via Web Push](/v1/docs/send-a-flash-sale-announcement-via-web-push) |

---

### 3 Monitor performance

Use Web Push channel statistics to view all notifications and see metrics for each send.

| Documentation | Description |
| --- | --- |
| [Web Push Channel Statistics](/v1/docs/web-push-channel-statistics) | Provides an overview of all web push notifications, allowing you to see the statistics for each. |

## Related

- [Technical Requirements and Download](/web-push-technical-requirements-and-download.md)
- [Web Push](/engage-web-push.md)