How to configure web push notifications using OneSignal?

A Web push notification is a message that pop-ups on your web browsers, mobile devices if you subscribed to it. Every blogger, an online marketer is using website push notifications to drive more traffic and to notify the readers about the new blog updates.

There are different WordPress plugins available to configure the web push notifications for your blog. Among them, OneSignal is the best Push Notification WordPress plugin I am using for my blog.

OneSignal is a free plugin, and you can send an unlimited notification to your subscribers. This is the thing most bloggers prefer OneSignal over other paid plugins.

Before proceeding to the OneSignal configuration, we will see the features of OneSignal.

NOTE- All the below features are for free plans, there is no paid plan for OneSignal.

• Unlimited devices- You can configure OneSignal to unlimited devices.
• Unlimited Notification- You can send as many notifications to your subscribers, there is no limit for notification.
• Scheduling- You can schedule your notification.
• Analytics- You can check the performance of your notification using OneSignal analytics. You can track the number of clicks, subscribers, etc.
• Import and Export data- This is a handy feature for taking the backup of your data. Also, you can use this data in another account by importing the current account data.

Now, it’s time to configure OneSignal for the WordPress blog.

Sign Up to OneSignal

First, you need to sign up for OneSignal.

Once, you complete the Sign-up, you will get a confirmation email. Please confirm the email address by clicking the link.

Create a new App

Now, login to your OneSignal account, click on the Add a new app

Provide the app name (you can take any name, but blog name would be better)

Now, you will get a pop-up, ignore that(close it).

Configure Push Notification for browsers

Now, go to setting and click on the All browsers in Web push platforms(refer below snapshot)

There are three methods to integrate the push notifications to your blog Typical site, a WordPress plugin, and Custom code.

The typical site method will provide you with the script and the SDK files which you have to upload to your blog’s root directory.

WordPress Plugin integration is the easiest way to configure push notifications. You will get the App ID and API key which you need to update in the WordPress plugin.

Custom code will provide you with the script which you have to update in your blog.

Here, I am going to tell you about the first two methods only.

Using Typical Site

Choose Integration

We have to choose the Typical site to integrate the website Push Notifications to your blog smoothly.

Site Setup

The next section is the site information, where you have to provide the site URL on which you want to configure the push notification(refer below snapshot)

Here, you have to take care of the last option. If your blog is on HTTPS or HTTP. If it is HTTP, then you will get another option to keep as it is but makes sure you are choosing the proper option.

If your blog has any favicon, icon then you can upload it here, it should be 192*192 pixels. This icon will appear in the notification.

Permission Prompt Setup

Next, you have to configure the approval of the subscribers.

You have to add the prompt for subscribers(refer below snapshot)

Once you clicked on the add a prompt, you will get a configuration screen(see below picture)

Here, you will have two options for prompt the notification Subscription Bell and Slide Prompt.

Slide Prompt is more effective than the Bell, so I would recommend you to choose Slide one. After that, you can customize the notification message or keep it as it is if you want.

You can also check the preview of your notification.

The next two steps are optional.

Welcome Notification

Here, you can show the subscriber message once they subscribe to your notification. By default, OneSignal will do that, but you can also customize it if you want.

Now, the basic setup of OneSignal is over. Click on the Save button, and you will have to download the SDK file and upload it to the blog’s root directory. Also, you will get the script code that you have to update in your blog header tag.

That’s it.

Now, you can check your blog, and you will see the prompt at the top of it.

Using WordPress plugin

This is the simplest method, and I would recommend you to go for it.

Choose the integration method as WordPress Plugin(refer below snapshot)

After that, you will have to provide the site information just like the above method.

Click on the Save button. You will get the App ID and API key which you need to update in the plugin. In this method, you will need to install the OneSignal plugin.

Log in to your WordPress blog and install the OneSignal plugin.

Go to the OneSignal plugin, open the Configuration.

Update the App ID and API key here which you got from the above step(refer below snapshot)

That’s it.

The configuration has been completed. Now, you can open your blog and check whether you are getting the notification or not.

Also, you can track the performance of your push notification in the OneSignal dashboard.

You would love to read below articles

• How to setup WordPress locally using DesktopServer in 10 minutes?
• SEO by Yoast WordPress plugin setup
• Things to do after installing WordPress
• Items to be remembered before buying a domain name