How to Add Push Notifications to WordPress

Do you want to start sending push notifications to your users? You’ve come to the right place. In this guide, we’ll show you how to add push notifications to WordPress to bring back visitors to your site.

What Are Push Notifications?

Push notifications are clickable messages that pop up on users’ mobile devices or desktops. The great thing about push notifications is that they let the users know about new content in the app/website even when they’re not using that app or browsing that site. They are excellent tools to provide useful information to users, offer deals, and bring visitors back to your site to increase engagement.

For example, when you receive an email, you probably get a push notification informing you about it. The same happens if you use social media apps like Facebook, Twitter, or Instagram. You probably get notifications when someone follows you, messages you, comments on one of your posts, and so on.

Push notifications are very effective so nowadays, most websites have different systems to trigger these messages and improve their user experience.

sample google chrome push notification

Why Add Push Notifications to Your WordPress Site?

Push notifications are an excellent way to generate engagement and turn visitors into loyal customers. Once they subscribe to your push notifications, you can send them custom messages to their mobile or desktop devices.

Considering that around 80% of your visitors will never come back to your site, push notifications can be a game-changer to increase the proportion of loyal customers. Not only does that mean more recurrent traffic to your site, but also more revenue as loyal users have a higher customer lifetime value (CLV).

Additionally, push notifications are easy to set up. There are several plugins out there that allow you to add push notifications to your site in a matter of minutes. On top of that, they don’t require much text or design so you can get them up and running in no time.

All in all, the main advantages of push notifications are:

  • Easy to install and integrate: Push notifications are super simple to implement and don’t require any coding. A simple plugin can do the job for you in no time.
  • Effective: Compared to email newsletters, push notifications are more effective. Additionally, they tend to require less content and design work. 
  • Increase recurrent traffic: The main goal of push notifications is to bring visitors back to your site and increase engagement.
  • Keep users informed: You can let your subscribers know about relevant information such as offers, new posts, promotions, and so on.

Now that we better understand their benefits, let’s see the different types of push notifications.

When To Use Push Notifications?

You can use push notifications for many different things. Some of the most common examples are:

  • Welcome Notifications: A message that welcomes every new subscriber. They are usually sent immediately after every subscription.
  • New Content: To let subscribers know that you have published a new piece of content.
  • Cart Updates: A great way to reduce cart abandonment.
  • Deals and Discounts: This type of message is an excellent way to boost your sales and encourage users to subscribe to your list.
  • Product Updates: When you have restocked, updated, or launched a new product.
  • Events: If you plan to launch any type of event, push notifications are a great way to create hype and spread the word.

Types of Push Notifications

The main types of push notifications are:

  1. Click-triggered
  2. Action-triggered
  3. Floating widgets

Let’s have a closer look at each of them.

1. Click-Triggered

Some WooCommerce stores have a notify me button so you can receive the latest news about that product. It’s usually common for products that haven’t been released yet or that are out of stock.

click triggered push notifications

These are called click-triggered push notifications. Users can opt-in for them and receive the latest information about that product.

If you want to add this type of push notification to your site, you can use a free plugin called PushAlert.

2. Action-Triggered

Action-triggered is the most popular type of push notifications. They are similar to click-triggered notifications but broader. Instead of targeting a set of users that are interested in a specific product, they target a wider audience. For example, we use this type of push notification on our homepage.

QuadLayers homepage

Other sites send this type of notification when shoppers abandon their carts or when there’s a new deal.

If you want to add this type of push notification to your WordPress site, plugins such as OneSignal and PushEngage are two of the best tools out there.

3. Floating Widgets

Floating widgets are very popular nowadays because they’re a great way to show information to all your users. They usually consist of a pop-up that works as a live chat to assist your visitors.

pushengage pop up

As users can chat with you in real-time, they’re excellent tools to improve customer service, increase your conversion rates, and build your email list. If you’re looking for a similar tool that integrates with WhatsApp, check out WhatsApp Chat that allows users to contact you from your site via WhatsApp.

Now let’s see how to add push notifications to WordPress.

How to Add Push Notifications to WordPress

There are many tools to include push notifications to your site. In our experience, OneSignal is the best so in this section, we’ll show you how to add push notifications to your WordPress site using OneSignal.

It’s a freemium tool that has a free version with basic features and premium plans that start at 9 USD per month. 

1) Creating OneSignal Account

First, go to OneSignal and click the Get started button. You will go to the registration page where you’ll have to enter your email address, password, and company name. Once you do that, press Create Account.

create onesignal account

The system will send you an email to confirm your email address.

2) Create Your First App

After confirming your email address, you will be redirected to your account dashboard. From there, you can add your first push notification.

add push notifications to wordpress push notifications

You need to name your app and choose a medium. In this demo, we will integrate OneSignal with WordPress, so choose the web push notifications option from the list.

add push notifications to wordpress configure onesignal

Additionally, you can also select Apple iOS, Google Android, or other options such as Windows, macOS, Email, and others under More options.

add push notifications to wordpress all platforms

After that, press Next to configure the push notifications.

3) Integrating Push Notifications

On this screen, you will see three integration options:

  1. Typical site
  2. WordPress plugin or Website builder
  3. Custom code

add push notifications to wordpress integration types

The easiest and most effective option is to use the OneSignal plugin, so choose the second option from the list and select WordPress as your Content Management System.

add push notifications to wordpress integration

Then, enter your website’s name and domain, and save to move to the next step.

add push notifications to wordpress onesignal site setup

OneSignal will give you a unique APP ID and API Key. Copy them and leave them somewhere handy because you will need them to configure the plugin.

onesignal app id and api key

Now let’s install the OneSignal plugin on our site.

4) Install and Activate OneSignal Plugin

In your WordPress dashboard, go to Plugins > Add new. Search for the OneSignal plugin, install it, and activate it.

install onesignal plugin

5) Plugin Configuration

After that, open the OneSignal settings and navigate to the Configuration tab.

add push notifications to wordpress - configuration

Here, paste the APP ID and API Key from your OneSignal account that you copied in Step 3.

save onesignal settings

After that, save the settings, go back to your OneSignal account, and click Finish.

You will be redirected to the app dashboard where you can add multiple integrations.

add more integrations

For now, let’s skip the configuration and focus on customizing our plugin to make it more personal. Let’s go to the OneSignal plugin settings again where you will see several customization options:

  • Sent Notification Settings
  • Subscription Bell Settings
  • Prompt Customization
  • Welcome Notification Settings
  • Automatic Notification Settings
  • UTM Tracking Settings
  • Advanced Settings

Let’s have a closer look at each of these sections.

a) Sent Notification Settings

sent notification

If you want to use a featured image for every post, simply activate the first and second options. Even though you can add custom images to the push notifications, they will use the post’s featured image.

You can also hide your notification after some time but we don’t recommend using this option to make sure your subscribers always see your messages. 

b) Subscription Bell Settings

subscription bell settings

After you configure OneSignal on your site, the plugin will display a subscription bell on the frontend to every visitor. The good news is that you can customize that pop-up’s color, size, and text.

c) Prompt Customization

prompt customization

This is one of the most important steps to add push notifications to your WordPress site.  From the Prompt customization, you will be able to configure the pop-up prompt. You can add custom texts, configure the action message, action button text, cancel button text, title, site name, notification title, and notification message.

The design of the pop-up is crucial to convince users to subscribe so make sure you take the time to build an attractive pop-up.

d) Welcome Notification Settings

welcome notifications

As its name suggests, this push notification is for welcoming your new subscribers. After a user subscribes to your push notification, you can immediately send a welcome note – just like you welcome new email subscribers when they join your list.

By default, they will get a “Thanks for subscribing” notification with your website link, but you can customize it. Make sure that you have enabled the welcome push, otherwise, this won’t work.

e) Automatic Notification Settings

onesignal automatic push notification send

This option allows you to send notifications every time you publish a post without any manual actions. On the other hand, some admins rely on auto blogging plugins such as WP Automatic to fetch content from other sites. If that’s your case and you use third-party plugins to publish content, enable the second option.

f) UTM Tracking Settings

In this section, you can enter custom UTM tracking URL parameters.

UTM tracking

Once you have entered a custom tracking code using any UTM campaign builder, you will be able to see the traffic you are getting through the push notifications you send. UTM tracking is a great feature and we highly recommend it to analyze how effective your push notifications are and how much traffic they are generating.

g) Advanced Settings

onesignal advanced settings

Some users use custom post types (CPT) to categorize their content. If you are using any CPTs, you can add them to this OneSignal option. Simply enter the CPTs in the corresponding field and save the settings. You can add more than one by separating them by commas. After that, save the settings and check the frontend. When someone visits your website, they will see a prompt like this:

add push notifications to wordpress - notification prompt

After allowing the notification, the user will be added to our push notification subscribers list.

You have successfully integrated and configured the OneSignal plugin on your site. Now, let’s see how you can start sending push notifications either manually or automatically.

6) How to send Push Notifications

You can send both automatic or custom push notifications. Let’s have a look at each of them.

6.1) Automatic Push Notifications

This is the easiest type of push. If you open any post from the WordPress dashboard, on the right-hand side you will see an OneSignal push notification checkbox. 

add push notifications to wordpress - send push notification update

Simply enable that option so when you publish or update your post, subscribers receive a push notification.

6.2) Custom Push Notifications

Alternatively, you can also send unique push notifications to your subscribers. To do this, you need to log in to your OneSignal account and go to the Messages section. There, you will see a New Push button.

new push notification

From there, you can create and send custom notifications. Simply enter a title, a message, and a URL (you can also include an image), and check the preview on the right-hand side.

add push notifications to wordpress - new web push notification

On top of that, we recommend you open the Advanced Settings to have more options about when to send the message. 

add push notifications to wordpress - send push notifications

Push Notifications Advanced Options

One of the things that makes OneSignal one of the best tools to add push notifications to WordPress is that it comes with many advanced settings to customize and improve your messages.

Some of its more advanced features are:

Multiple Administrators

add push notifications to wordpress - administrator

If you create the OneSignal account, your email address will be added to the administrator field by default. However, you can add more users and give administrator permissions to other members of your team. Simply enter their email addresses and save them. 

Automated UTM Tracking

add push notifications to wordpress - save UTM settings

OneSignal allows you to create UTM tagging. Once you have turned this feature on, you can create custom URLs with the source, medium, and campaign to track the traffic that comes from your push notifications.

 

Analytics Assist

add push notifications to wordpress analytics assist

For better tracking, you can integrate the analytics into OneSignal’s API, Google Analytics for Firebase, Mixpanel, and Microsoft App Center Analytics. The free version only allows you to integrate your site with Firebase, for the other ones you need to upgrade to a premium plan.

Conclusion

In summary, push notifications are a great tool to bring visitors back to your site, increase engagement, and boost your sales. We’ve seen the different types of push notifications and when to use them.

The best part is that you can add push notifications to your WordPress site in a matter of minutes. In this tutorial, we’ve shown you how to integrate and set up OneSignal on your website. Additionally, we’ve seen different options and use cases so you can make the most of it regardless of the type of site you have. 

OneSignal is a freemium service so we recommend you start with the free version and then upgrade to one of the premium plans if you need more advanced features.

We hope you have found this article helpful. If so, please share it on social media.

Have you added push notifications to your site? What type of messages are you using? Let us know in the comments section below!