How to implement Web Push with Batch?

Welcome to Batch!

Batch allows you to send push notifications directly to web browsers on desktop and mobile. They allow you to re-engage your users, even if your website is closed. After a 20-minute setup, you will be able to push them directly from your website without making them install your app. And just like native applications, web push notifications can include rich content.

A full integration is divided into five steps:

1. Account creation - Required

2. SDK integration - Required

3. Opt-in optimisation - Optional

4. Profile data collection - Optional

5. Test and release - Optional

6. APIs setup - Optional

1. Account Creation

You can create an account now on https://batch.com/register.

We recommend you to invite your team members from the account manager section, in the bottom left corner of your dashboard, in "My team" → "Add member".

Feel free to contact us at [email protected] if your account is not on the correct plan.

2. SDK integration

Once your account is created, add your website to the dashboard.

You will find all the technical details on the integration in the documentation:

1. Add the javascript tag automatically generated by Batch to the code of your web pages. This can be done manually or using a tag manager.

2. Download and upload the service worker to the root of your website.

There are two extra steps you need to take to perform a full integration of Batch:

• Icons: Set up a default and a small icon to make sure notifications are displayed correctly (know more here).

• Opt-in optimisation: Customise the pre-permission prompt that will allow you to collect your users' tokens.

Please note that the integration may vary if you integrate Batch into a Progressive Web App (know more here).

3. Opt-in optimisation

To maximise the chances that your users subscribe to notifications, we built multiple ways of asking for permission (know more here).

You can choose between three different formats:

• An alert

• A banner

• A button.

In case you don't want to use Batch's formats, you can trigger the native prompt of each browser. That permission request can be shown 3 times a week.

4. Profile data collection

In addition to the data the SDK collects natively on your website, you can collect profile data to improve your segmentation.

Custom User ID

Batch lets you track a unique user ID (see documentation) that will uniquely identify user Profiles and centralize profile data from attached devices. This is a recommended step if your website has a login wall or if users can create an account on your website.

You can use that Custom user ID with the Profile API to:

• send events to trigger 1-to-1 push notifications to one or several user IDs (e.g., package delivery notification, etc) ;

• send profile data (attributes, events, or arrays) to Batch to enrich a user's profile data.

User ID collection also allows your teams to target with one click users who are / are not logged in (see has custom user ID).

Custom Language/Region

Batch automatically detects the language and the country of your users’ browser. If users can select a region or a language from your website, we recommend you overwrite the values automatically detected by Batch (see documentation).

5. Test and release

Once the integration is completed, the JavaScript tag can be released.

Batch will start collecting your users’ tokens and you will be able to send your first notifications from the dashboard.

You can also use the Profile view from Profiles → Search Profiles at any moment to test the integration of the SDK and the data collection.

6. APIs Setup

With Batch RESTful APIs you can easily send profile data and trigger push notifications to leverage Batch’s engagement features:

• The Profile API allows you to create and enrich user profiles with profile data such as attributes, events, and arrays. This data can then be used to create segments or trigger messages.

• The Campaign API allows you to send one-shot push notification campaigns to your segments built based on chosen criteria.

• The Export API allows you to retrieve your campaigns performance data to feed your analytics or BI tools with more insights.

Depending on the use cases you plan to set up, we can help you through the use of these APIs.

Need Assistance?

Our technical team is reachable via the “live chat” in the bottom right corner of every page of the dashboard (median response time lower than 3 minutes from 9 am to 7 pm on working days).

You can also contact us using our universal support address [email protected] read by our team.