Complete Web Push Notification using OneSignal in 10 steps

A push notification is a message that is “pushed” from backend server or application to user interface.

Push Notifications can be beneficial in many ways. Users can be provided with latest sports scores, some breaking or flash news or let a user know about an event or offers. Push Notifications may seem similar to an alert message and users who have subscribed will only get the notification.

In this post, we will be learning to send push notification with OneSignal. OneSignal provides the facility of sending push notification in various platforms as iOS, Google Android, Web Push, Amazon Fire, Windows Phone and Mac OS X.

Configuring OneSignal Web Push Notification

1. In order to send OneSignal Web Push Notification, you need to have OneSignal account. If you don’t have account, get it from OneSignal website.

2. Add a new App.

3. Select a platform. In this case, we will be selecting Web Push.

4. We can see three options for configuring Web Push: Typical Integration, Website Builder and Custom Code

We will go with Typical Integration

5. Under Site Setup, fill in the required fields: Site Name and Site URL.

6. Under Permission Prompt Setup, add prompt and customize the look and text as per your need.

7. Welcome Notification can be enabled if you want to show notification whenever a user subscribes you.

8. Now save the setting and you will get JavaScript code. Place the code in your webpage and now you are ready to send the first push notification.

9. When user access the webpage, he will be prompted to allow push notification and if user allows, you can now send push notification.

10. Under Messages, click New Push. Provide title, message, image, link and other fields and submit the form to send push notification to your subscribed users.

Demo Notification:

For complete instructions and procedure, you can follow this video: