Do you want to add Web Push Notifications to your WordPress website? Don’t worry, in this article, I will show you how to add web push notifications to the WordPress website.
Web Push Notifications are the best way to increase web traffic and conversions. It is the only way that can make a relationship between your website and visitors. You can inform your visitors about newly published blog posts.
Also with the help of web push notifications, you can show alerts about e-commerce products to the users of your website.
So first of all, let’s see what are we going to learn in this article.
What are Web Push Notifications?
Web Push Notifications are like messages or alerts that you receive on your phone. Only those users who receive these messages and alerts allow them. Push Notifications are a way to directly speak with your web visitors.
There are a lot of benefits to using push notifications on a website. And some of the major benefits are an increase in traffic, click-through rates, and open rates. After using web push notifications, you will see an increase in your web traffic.
According to large online communities that use push notifications on their sites. Say that push notifications have greater opening rates compared to emails.
Every user of your website who opt-in to receive push notifications will always receive a notification about your recently published content. This happens always automatically when you publish something new on your site!
Web Push Notifications Example
Before starting. Have a look at the image below to know how to do web push notifications look like on a website. Also see, how to allow web push notifications?
Now, let’s see how to set up web push notifications.
How to Add Web Push Notifications to WordPress Website
For this purpose, I am going to use a plugin called OneSignal to set up web push notifications on the WordPress website.
OneSignal is not just a plugin for web push notifications. This plugin has a lot of other cool features that I will show you in this guide. OneSignal supports all modern browsers.
- Chrome
- Microsoft Edge
- Safari
- Mozilla Firefox
Also, the OneSignal plugin is available for all major platforms like WordPress, Shopify, Blogger, Drupal, Joomla, Wix, etc.
To get started with this, the first thing we need to do is to create a free account on the OneSignal website. So that we can connect it to our WordPress website. It’s pretty easy. So, let’s begin.
1. Create a Free Account on OneSignal
To create a free account on OneSignal first, go to the OneSignal website. After that click on the Sign-up or Get Started button as shown in the image below.
After clicking on the sign-up button, it will take you to a sign-up page. Now, there enter your email address, password, and company name( you can also enter your site name here).
Below, as shown in the image, you can also sign up with your Google account, Facebook account, or GitHub account.
After entering your details, click on Create Account button. After clicking on that button, you will receive an email from OneSignal to confirm the email address you entered.
So, go to your email inbox and open that email and click on confirm your account.
Now in the next step, you will have to connect the OneSignal account to your WordPress website.
2. Connect Your WordPress website to OneSignal
After clicking on confirming your account button, you will redirect to a configuration page. As I capture the images for your convenience so you can understand every step easily. Now, let’s go to the next image.
As shown in the image above, select the Web option and click on Configure Your Platform button. In the next step, you will choose on which platform you want to set up push notifications.
As we’re using WordPress CMS, so we will select the second option. Because we want to use it for our WordPress website. So, choose the WordPress Plugin method to set up web push notifications on your WordPress website.
Don’t worry, after a few steps, we will install and set up the OneSignal plugin quickly.
Now after choosing the WordPress Plugin method as you saw in the previous image. You have to select WordPress.
After that scroll down the page a little bit and enter your site details.
Only enter your site name, and site URL and click on the Save button. As shown in the above image. You can also upload your site logo by clicking on the upload button.
After that see the image below.
Now we have our push notifications APP ID and API Key. I hid my own id and API in the image above because you will have your own. Just copy the APP id and API key to use it later.
And don’t close this tab in your browser until the setup is completed. It’s time to install the OneSignal plugin on the WordPress website.
3. Install the OneSignal Web Push Notifications Plugin
To install the plugin, log in to your WordPress dashboard. And go to the plugins section and search for the plugin. And click on the install button and then activate.
Don’t worry, if you don’t know how to install a plugin in WordPress. Check out our step-by-step guide on how to install plugins in WordPress.
After the plugin installation. Configure the plugin.
4. Configure OneSignal – Web Push Notifications Plugin
To do this, go to OneSignal options. You can find it located at the left bottom in Your WordPress dashboard sidebar. Just click on the button as shown in the image to open the options page.
After that, you will see a configuration page like below.
As you can see in the above image, you need an App ID and API key. And you have copied it already. Just paste the App ID and API key and leave the safari web id field empty. Now scroll down the page. And select the features that you want to use.
After all that don’t forget to click on the Save button located at the end of the page.
Congratulations! you have added push notifications successfully. Also, if you want you can change settings according to you, on the configuration page.
If you have any questions about this article, then feel free to ask the questions in the comment section below.
