Before you create and send your first web push notification, you must: - integrate with Synerise via JS SDK, - create a Firebase account and integrate it with Synerise to start collecting web push agreements on your website. - [install service worker on your server](#install-service-worker). Web push notifications will be shown to a visitor, who agreed to receive web push notifications, according to the settings. The following web push related events are collected by default: - `webpush.subscribe` - a visitor has agreed to receive web push notifications - `webpush.subscribeBlock` - a visitor hasn't agreed to receive web push notifications - `webpush.subscribeDiscard` - a visitor closed an agreement form (there is a possibility that the visitor will subscribe in the future) - `webpush.send` - a web push notification was sent - `webpush.show` - a web push notification was displayed - `webpush.click` - a visitor clicked a web push notification - `webpush.notRegistered` - a web push notification wasn't sent due to an invalid token ## Requirements --- - You must be granted user permissions to access **Settings**. - Your site must fully support HTTPS. - Your site must redirect all `http://` requests to `https://` requests. - [Integrate with Synerise via Synerise JS SDK](/docs/settings/tool/tracking_codes) (make sure your tracking code covers web push notifications).

Perform the configuration in the given order.

## Integrate Firebase with Synerise --- The full procedure of Integrating Firebase with Synerise is available [here](/docs/settings/tool/firebase). ## Install service worker --- 1. Go to

**Settings > Web push**. 2. Click **Show** in **General** section. 2. Switch the **Web notifications currently disabled** toggle to **Web notifications currently enabled**. **Result**: The installation instruction appears.

The Instruction section — The installation instruction

3. Follow the commands on the interface.

The file should be available under the site root with the same filename, for example: `example.com/snr-sw.js`. Example for a subfolder: `example.com/other/path/snr-sw.js`. If you choose other directory than the root, to properly use the service worker you must declare the `Service-Worker-Allowed: /` header. In case you use a different worker, you can add `snr-sw.js` contents to your worker file and rename it to `snr-sw.js`.

4. In the **Path to service worker** field, enter the path. 5. Confirm by clicking **Apply**. **Result**: The configuration is completed. The next step is to prepare [web push agreement forms](/docs/campaign/Webpush/one-step-agreement-form).

In service worker version 3.0.0 (or higher), we have optimized the size of webpush frames sent to Firebase and enabled action buttons in web push notifications. The version of the service worker stored in the customer's browser can be identified in the [webpushToken.update](/docs/assets/events/event-reference/webpush#webpushtokenupdate) event in the version parameter

What if web push notifications still don't display?

Make sure the web push notification doesn't contain errors.
- In case there are any snippets used in the template, make sure that the item of information you want to display using an snippet is available on the customer cards of the recipients. For example, if you want to mention the recipient's city name in the template, check if all recipients have the name of the city in the customer's card, otherwise, this snippet will not display.
- If a web push is displayed differently than expected, check how the specific browser, operating system, or device handles web pushes.
If the web push notification is created correctly, go to your website.
Open the console.
Search for SR.init.
If there is the disableWebPush parameter, contact your developers to remove it.