How to Create a Web Push Notification

A web or browser push notification is a pop-up message that shows up in the browser window on desktop and mobile. It can be delivered when the browser is open regardless of whether the user is visiting the sender website at the moment.

To send web pushes from your website, you need to install a web push code in it.

Since web push is a permission-based channel, you need to ask users to subscribe to your web notifications. You can select two types of a subscription request (Single Opt-In or Double Opt-In) and customize request prompts for the Double Opt-In subscription.

See a step-by-step guideline on how to start sending web pushes from your website.

1. To create a web push notification, go to Messages > Messages, select Web Push and click Create Web Push.

2. Enter the name. It will be used for search within the system and won’t be visible to users.

3. Enter the title. Stick to no more than 30 characters.

4. Enter the text. Stick to 45 to 60 characters. More characters may distort the web push display in the browser.

You can personalize the title and text by adding dynamic variables through Velocity. They will be substituted by personal contact data at the moment of the message launch. You can add as a variable any personal data available in the contact profile. It’s especially useful for transactional messages like an order confirmation, account report, reactivation, etc.

5. Enter the site link.

6. Optionally add tags. They help filter messages and statistics and manage sending frequency.

7. Add a logo. Upload a JPEG or PNG, up to 128KB or add a dynamic variable. Uploaded logos are saved in Uploaded and you can switch to them in a click.

8. Optionally select subscription categories.

9. For Chrome, add a banner and one or two CTAs.

10. You can set Time to Live (TTL). This is the time during which the web push is stored at the provider’s server if the recipient isn’t available for delivery.

11. Enable UTM tags and they will be automatically added to your URL.

In our platform, you can create a multilingual version of any message. Click the globe icon in the top panel, specify the default language and add language versions. Fill each version with the content in the corresponding language. You can switch between versions within one template in one click.

Read more on how to create and launch multilingual campaigns.

To test a web push notification, click Test in the top panel.

After all settings are done, click Save and exit to save the notification or Create campaign to go to campaign launching.

How to Launch a Web Push Campaign

1. In Messages > Messages > Web Push, click Create campaign or open the message and click Create campaign inside.

2. Optionally, enable Hide notifications automatically. The notification will remain on the screen for 8 to 20 seconds depending on the browser. With the disabled option, it will remain on the screen until the user clicks it to open or close.

3. Select segments.

4. Check the notification details and preview it in different browsers.

5. In Send options, schedule the message or start it immediately.

How to Send a Triggered Campaign

You can create a triggered campaign and notifications will be sent to users in response to their activity. Any activity (subscription, registration, order, password reset) can trigger a notification.

As an example, let’s see how to send a campaign triggered by a subscription confirmation.

1. Go to Automation > Workflows and click New workflow.

2. Create a workflow with a required Web Push block. In settings on the right, select a message to be sent. Click Save.

3. In Automation > Workflows, click Trigger configuration.

4. In On event, select the event type and how often to process unique events. You can create a new event in Automation > Event types.

5. Click Apply.

6. In the general workflow list, click Start. The workflow status will change to active. The workflow will now be automatically sending messages to all subscribers after subscription confirmation.