What are browser push notifications

Push notifications are messages that appear on a user's device screen, used to encourage specific actions. They can inform users about promotions, remind them of personalized promo codes, or update them on order status changes.

There are mobile and browser push notifications. Mobile pushes come from mobile apps, while web pushes are sent by browsers.

For more details about mobile and browser push notifications, we have covered them in our blog. In this guide, we will focus on browser push notifications and explain how to set up push campaigns in the Altcraft platform.

Advantages of web push notifications:

1. High open rate: Push messages are opened more frequently than email newsletters, with a 50% higher Open Rate and a 7x higher CTR.

2. Increased user engagement: Users are more likely to subscribe to push notifications compared to email newsletters, as they don't need to provide their email or phone number.

3. Boosted conversion: Research indicates that 48% of customers make a purchase after receiving a push notification. This is due to users being directed to the desired page instantly and notifications arriving at the right time, eliminating the need to wait for email or SMS reading.

4. Avoid spam filters: Unlike email messages, push notifications bypass spam filters.

5. No need for mobile app development: Interaction occurs through desktop and mobile browsers.

How browser push notifications work

The user visits a website. An overlay appears in the upper-left corner, requesting permission to show notifications from the website. The user can choose to either accept or decline the notification request.

Request to allow to show push notifications

After clicking the "Allow" button, the user will start receiving push notifications from the resource. It's worth noting that push notifications will be delivered even if the browser is closed at the time of sending.

How to set up browser push notification campaigns

Step 1. Configure web push for browsers

To send browser push notifications, different services are used by browsers:

This guide tells you how to set up a web push for a certain browser.

Step 2. Create a customer database

To send notifications to a specific subscriber, a unique device identifier is used. Each device receives this ID as soon as the user allows notification display.

The device identifier, along with other user information, is stored in the profile database. If you don't have a database yet, create one.

To create a new database, select Data → Profile Databases from the main menu, then click the "Create" button in the upper right corner. Configure the database following these instructions.

Step 3. Create a resource and set up a push channel

Resource enables sending customers only the content that interests them. A resource could represent a website, mobile app, specific marketing focus, or content type. For instance, if a customer agrees to receive promotions from an online store, subscribe them to the "Online Deals" resource. If they later show interest in blog articles, add them to the "Blog" resource subscription.

A customer can be subscribed to one or multiple resources. They can unsubscribe from notifications of a specific resource at any time.

To create a resource, navigate to the "Resources" section from the main menu, and click the "Create" button in the upper right corner. Choose the Push channel for subscription.

In the main settings of the resource, specify:

• The database you created in the previous step.

• The URL of your website.

• The tracking domain for monitoring subscriber actions in the notification.

Next, select the browsers to which you plan to send push notifications and configure the resource for each of them. Instructions on how to do this can be found here.

Step 4. Connect push notifications on your website

Once you've filled in the necessary settings, save the resource by clicking the "Apply" button. In the "Install" section, you'll find the Toolkit. Download it from here:

The files contained in the Toolkit need to be placed on your website using one of the provided methods. Then, add the code that will display the subscription window for the desired action.

Visit your website. If everything is done correctly, a notification window will appear in the upper left corner. Now, any visitor to your site can subscribe to browser push notifications, and their device identifier will be saved in the profile database.

Step 5. Upload customer data and sign them up for the resource

If you already have a database of identifiers for your customers, you can upload this data to the platform. You can upload the data manually, through clipboard or [a file]9https://altcraft.com/help-center/create-customer-profiles/how-to-import-customer-data-from-a-file). Additionally, you can set up automatic profile imports:

• on a schedule from your SQL database

• via integration with the platform's API

To add customer data to the database, click on the import icon.

For each customer whose data enters the database, a unified digital profile is created. It combines personal information, action history, and subscriptions to resources.

When importing data, sign up customers for the previously prepared resource by clicking the "Add subscription" button. Choose "Push channel" as the communication channel. Leave the subscription status as it is: "Subscribed." Specify the column in the file table that contains users' device identifiers.

Step 6. Create a Template

Message templates are the content you send to subscribers in your campaign. You need to create a new template for the Push channel or add this channel to an existing template.

What can be included in the template:

• Title

• Icon

• Message body

• Link for redirection

Click on the </> icon to open the menu of variables and editor functions. Use variables to personalize your message. Add customer profile data (name, city, age, etc.) to the push, send personalized promo codes to subscribers. Utilize loops, logical expressions, and dynamic content.

If you're sending Rich push notifications, use the special editor to create your template. With Rich push notifications, you can include not only text and icons but also buttons, images, banners, audio, and even video files. Moreover, the new editor allows you to customize notifications separately for each browser, as well as add adaptive links and deeplinks.

To open the new editor, go to the regular template editor and create the initial version of the push message as described above. After that, click "Apply" and then click "try editor β" to switch to the new editor.

Step 7. Set up the campaign

The campaign defines the method of distribution. The type of campaign that suits you depends on the goals of your messaging:

• Need to send unique content to subscribers only once? — Broadcast.

• Planning to send content with the same frequency? — Regular campaign.

• Want to send content to a subscriber as soon as a certain event occurs? — Trigger campaign.

The campaign determines the distribution method. The specific type of campaign that suits you depends on your messaging goals:

To set up a campaign, specify:

1. The push channel for communication with subscribers.

You can choose subscriptions with a specific provider. Eliminate unwanted providers by clicking on the cross.

You can also specify the mode for sending push messages.:

• fanout (by default) — sending profiles to all subscriptions that match the filters set in the campaign.
• last — sending to a subscription with the most recent creation date.

2. Recipients of the campaign: clients whose data you've uploaded to the database and then subscribed to a resource.

3. Choose a push template

4. The sending schedule.

Learn more about campaigns and how to configure each type in this article.

Step 8. Test the campaign

Before launching the campaign, it's a good idea to test it. A test send will deliver the message to the device of a profile that you've registered as a test subscriber in the platform.

This will allow you to ensure that:

• push notifications reach the user;

• they are displayed correctly across all browsers;

• dynamic content and variables are functioning properly;

• to initiate a test campaign, find your campaign in the general list and click on the corresponding icon in the campaign menu.

Step 9. Activate the campaign

To do this, click on the icon.

The campaign will become active, and once the launch day arrives, it will begin the distribution.

Step 10. Evaluate the results

Has the distribution completed? Don't forget to analyze the obtained results. To do this, go to the "Analytics" section.

Detailed statistics about the distribution are gathered in “Channels”. Here, you can review metrics such as push delivery and open rates, link clicks, unsubscribe rates, spam complaints, hard and soft bounces, and more. For ease of grouping, you can select performance metrics specifically for the Push channel.

Calculating how many people who received the email campaign or template took a specific action can be achieved through a conversion funnel. Utilize the email campaign or template as the steps in the funnel.

Check list

1. Configure push notifications for specific browsers.

2. Create a new database to store device identifiers from which users subscribe to the newsletter.

3. Create a resource to limit interaction with subscribers within a specific topic.

4. Connect push notifications to your website using developer tools.

5. If you already have device identifiers, upload them to the database and subscribe users to the resource.

6. Create a push notification template using either the regular editor or a specialized editor for rich push.

7. Choose a delivery method (campaign), specify recipients, and the template you want to use in the distribution.

8. Test the distribution by sending a push to test subscribers.

9. Activate the distribution.

10. Evaluate the distribution's effectiveness by studying the metrics in the Analytics section.