Chat with us, powered by LiveChat

This website uses cookies

Our website, platform and/or any sub domains use cookies to understand how you use our services, and to improve both your experience and our marketing relevance.

How to Enable WordPress Push Notification Using OneSignal

June 13, 2019

8 Min Read
wordpress push notifications
Reading Time: 8 minutes

Maybe your WordPress website is among the significant number of the sites that regularly publish new content. In order to get the right eyeballs in a healthy number, every single content piece should be marketed to the right audience.

Can you think of a better way of marketing your content than showing a web push notification that pops up on your subscriber’s screen, every time you update or take a new blog live?

Let’s dig a bit deeper and see how you can add WordPress push notification to your website via OneSignal.

What Is WordPress Push Notification?

WordPress push notifications kick in every time a blog is updated or published on a blog. These notifications resemble desktop notifications and are a great tool for re-engaging your existing audience. If used smartly, Web push notifications can potentially become the top referral source for your websites.

Facebook is one of the many products/platforms that have elevated the use of web push notification to a fine art. If you have enabled chrome push notifications, and the Facebook tab is closed, you usually see a pop-up notification of a new post in the bottom right corner of the screen.

Why Use WordPress Push Notifications?

WordPress push notifications come handy when brands want to re-engage their audience. In particular, web push notifications are useful for:

  • Special Offers: Promoting special discounts or limited time offers to drive more sales.
  • Announcements: Inform and educate the audience about key events, products updates, etc.
  • Onboarding: Welcome new visitors, notifications about a purchase, requests for product reviews, abundant cart, upsell, etc.

In today’s guide, I’ll show how you can enable chrome push notifications for WordPress and redirect more traffic to your website. WordPress plugin directory has several plugins that can automatically provide/enable desktop notifications for your visitors/subscribers.

While I urge you to experiment with the plugins to discover the best fit for your website, for the purpose of this tutorial, I will use OneSignal – Web Push Notifications plugin.

In a nutshell, here’s how the plugin works: When you publish/update a post (and marked the checkbox where it says, send notification on post update just above the Publish button), OneSignal will send a web push notification to the subscribers even if they have left your website.

So, here we go!

At this point, I am assuming that your website is hosted on Cloudways, a very powerful managed WordPress Hosting Platform. If that’s not the case, learn how easy is to host a WordPress website on Cloudways for the best performance.

WordPress Push Notifications Plugin

Let’s start with installing the OneSignal WordPress Push Notifications plugin.

Login to the WordPress Dashboard, Navigate to → Plugins → Add New. In the top right search box, search for “onesignal” (without space). Once found, click the Install Now button, and then activate the plugin.

plugin-installation

Navigate to OneSignal Push from the left admin menu. You will see the default OneSignal dashboard, that offers tips on how you can quickly set up OneSignal to start sending out WordPress push notifications.

setup-confiigure

Enable Web Push Notifications for WordPress

Enabling the OneSignal WordPress plugin and setting up desktop notifications for Chrome and Firefox browsers is a simple matter.

Start by creating an account on the OneSignal website. After successful registration, you will be redirected to the OneSignal dashboard, where you need to add a new app.

Click the Add App tab and enter the App Name. For the purpose of this tutorial, I am naming the app “Testing Web Push”.

add application

Next, click the Add App button and it will redirect you to Select Platform. Since I am setting up web push notifications, I will choose Web Push from the available options and click the Next button.

edit app push

On the next screen, choose WordPress plugin or Website Builder and then select WordPress as shown in the screenshot below.

choose integration

Scroll down a bit and enter the necessary details like site name and URL. If your website is not using HTTPS, remember to set the toggle labeled My site is not fully HTTPS.

Note: Google highly recommends securing WordPress websites with SSL certificates.

wordpress site setup

Click Save at the bottom of the page. Next, you will be provided the App ID and the API Key that would be used in setting up the OneSignal WordPress plugin.

configure wordpress pugin

Get back to your WordPress Dashboard →  OneSignal Push → Configuration and paste the above keys.

account settings

And now, you have a long list of options that needs to be enabled or disabled.

Subscribe to WordPress Push Notification

Now, whenever someone visits your website, OneSignal will show a bell at the bottom left or right side of your website. A visitor can click this bell icon to subscribe to web push notifications from your website.

subscribe to notifications

A new pop-up will appear seeking permission from the visitor for delivering and displaying push notifications.

show notifications

If a user clicks the Allow button, he will see a pop-up at the bottom of the page.

just another wordpress site

And, the visitor is now subscribed to receive web push notifications successfully.

you are subscribed

Send Push Notification to Subscribers

Okay, so now you have configured everything correctly and the visitors can subscribe to receive WordPress push notifications.

Let’s test this!

I have created and published a new post on my WordPress website titled ‘New Post’.

Here is the notification icon at the right bottom of my screen. As you can see, the default image, site name, post title and the subdomain name are already there.

new post

Unsubscribe from WordPress Push Notifications

The best part about OneSignal push notification is it allows the visitors to unsubscribe easily. Simply click on the Bell icon at the bottom of your screen and it will present a message to unsubscribe from web push notifications.

manage site notification

Alternatively, visitors can change subscription preferences by going to the Site Settings.

site settings

Here, visitors can choose their preference to get chrome push notifications for your website.

ask default

Find Websites You Have Already Subscribed

Every browser maintains a list of the websites a person visits and subscribed to. In this tutorial, I will focus on chrome push notifications. To see the list, follow these steps:

  1. Open Chrome.
  2. In the top right, click the three vertical dots (), and then Settings.
  3. At the bottom, click Advanced.
  4. Look for “Privacy and Security,” click Site settings.
  5. Click Notifications to see the list of Blocked or Allowed websites.
  6. To block a site: Next to “Block,” click Add. Enter the site and click Add.
  7. To allow a site: Next to “Allow,” click Add. Enter the site and click Add.
  8. To edit a site: Click (), Edit and choose your preference.

For other browsers, check out their official docs about web push notification.

Customize the OneSignal Notification Bell

OneSignal push notification plugin allows you to customize the notification icon. This is a great way to ensure that the OneSignal icon matches the installed WordPress theme.

For this, navigate to WordPress Dashboard → OneSignal Push → Configuration. There, you will find the following WordPress notification settings:

  • Account Settings
  • Sent Notification Settings
  • Prompt Settings & Notify Button
  • HTTP Pop-Up Settings
  • Welcome Notification Settings
  • Automatic Notification Settings
  • UTM Tracking Settings
  • Advanced Settings

What More Can You Find in OneSignal Push Notification?

OneSignal Push Notification is an all-in-one solution for all kind of WordPress desktop and mobile notifications. What follows is a list of the most popular features. If you wish, you can read the full list here.

  • 15 Minute Setup
  • Third Party Integrations
  • Free & Unlimited
  • Real-Time Tracking
  • A/B Test Messages
  • Segmentation Targeting

Explore Subscribed Users

The best thing about OneSignal web push notification is the extensive data on the subscribers that you can analyze for ‘connecting the dots’.

For this, login to your OneSignal account, navigate to Users and see all the data.

OneSignal account,

To know more about your WordPress push notification subscribers, click View Users.

And, you will see how well OneSignal organizes data on subscribers.

OneSignal organizes

If you wish, you can also remove/delete a subscriber by clicking the OPTIONS and select Delete.

add test users

Track Web Push Notifications

From the top menu bar, navigate to Delivery. All your WordPress pushed notifications are available in this section. Not only this, you can get more insights about each pushed notification by clicking the push notification title. In my case, it’s the ‘New Post’.

Track Notifications

More WordPress Push Notification Plugins

As I mentioned earlier, there are a lot of options in WordPress plugins for sending out web push notifications. If you are not comfortable with what OneSignal has to offer, you can test the following plugins:

Since this guide was focused on using OneSignal, I would suggest you explore more about OneSignal push notification for WordPress.

Now comes the BIG question: is it FREE? Yes, it is!

OneSignal’s business model involves selling subscriber data to advertisers and research companies. However, if you are concerned about the privacy of your subscribers (and you should be!), get the premium version.

In case you run into any issues, check out the official documentation to discover a solution. If you have any queries about the plugin integration or functionality, feel free to ask me through the comments section below.

Share your opinion in the comment section. COMMENT NOW

Share This Article

Start Growing with Cloudways Today!

We never compromise on performance, security, and support.

Mustaasam Saleem

Mustaasam is the WordPress Community Manager at Cloudways - A Managed WordPress Hosting Platform, where he actively works and loves sharing his knowledge with the WordPress Community. When he is not working, you can find him playing squash with his friends, or defending in Football, and listening to music. You can email him at mustaasam.saleem@cloudways.com

Get Our Newsletter
Be the first to get the latest updates and tutorials.

Do you like what you read?

Get the Latest Updates

Share Your Feedback

Please insert Content

Thank you for your feedback!

BFCM 2019