how to add web push notifications to your wordpress site

How to Add Web Push Notifications to Your WordPress Site

Do you want to set up WordPress push notifications on your website?

With the increase in competition, every website is aiming for repeated visitors.

With web push notifications, you can send messages to users even after they have left your site. This increases targeted traffic which will eventually result in increased revenue.

In this article, we’ll show you how to easily set up the WordPress push notification plugin and drive more repeated visitors.

Fix Your WordPress Emails Now

What Are Web Push Notifications and Why You Should Consider Using Them?

You must have seen this notification prompt while surfing the internet.

Push notification optin from OptinMonster

Web push notifications are messages sent to visitors (who have opted to receive them) after they have left your website. Web notifications work and look exactly like the notifications you receive on your phone. The only difference is that they are sent through the browser.

They work on both desktop and mobile devices and users don’t have to be on your website to receive them.

Web push notifications are known to have a higher opening rate than email marketing. Saleduck, an online deal community got a 400% higher open rate with push notifications.

Push notifications also have 4x higher click rates than other marketing channels. The delivery rate is 90% which means there is no risk of your message getting delivered in spam.

They are also less annoying for visitors as they can unsubscribe from the list at any time in the future.

Having said that, let’s see how to easily add web push notifications to a WordPress site using PushEngage.

How to Set up Free WordPress Push Notification Plugin with PushEngage

PushEngage is a free WordPress push notification plugin that has support for most popular browsers such as Chrome, Firefox, Safari, and Microsoft Edge.

It is a feature-rich plugin that lets you A/B test your messages to see which ones have a better conversion rate. It also allows automatic push notifications whenever you publish something new.

If you have a WooCommerce website, you can send Cart Abandoned Push Notification, Price Drop Alerts, Inventory Alerts, and many more.

The free version allows 2,500 subscribers and up to 120 notifications per month. Paid plan starts at $25/month for up to 100,000 subscribers and unlimited notifications.

Ready to send push notifications from your WordPress website? follow the steps below.

  1. Install the PushEngage Plugin
  2. Create a Free Account on PushEngage
  3. Connect Your WordPress Website
  4. Set Welcome Notification
  5. Set Up Subscription Dialogbox
  6. Upload PushEngage Files
  7. Start Sending Push Notification

Let’s first create a PushEngage account and connect it to our website.

1. Install the PushEngage Plugin

To install the plugin, go to the WordPress dashboard and go to the plugins page. Search for PushEngage and install the plugin. Make sure you also activate it. If you are not sure how to, check out our step-by-step guide on how to install a WordPress plugin.

Once you’ve got the plugin installed, you can proceed to create a free account on PushEngage and link it to the plugin.

2. Create a Free Account on PushEngage

Head over to the PushEngage website and click on Get Started for Free. Now, choose the plan according to your requirement and fill in the details. Click on Create My Free Account to proceed to the dashboard.

If you choose to set up using your Google account, PushEngage will prompt you to enter your website details.

Once you are into the dashboard, you will see a setup wizard that makes it easy to configure the plugin. Click on View Tasks to start the process.

PushEngage tasks

The first task in the list is to upload your site logo that will appear as the default image in the push notification message. Click on the Change button and upload an image in either PNG or JPG file format of size 256x256px.

Upload image for push notification

The next task is to set your time zone which PushEngage will automatically detect when you connect it to your website.

3. Connect Your WordPress Website

The third task is to connect your site to a PushEngage account.

Since we are using WordPress to send push notifications, we just need to copy the API code from PushEngage and paste it on our website.

If you’re using PushEngage with some other CMS, you need to follow the given steps for that particular website type.

Scroll down and click on the Get API Key button and then click on Generate a new API key.

generate new API key in PushEngage for WordPress website

Copy and paste the API key on our WordPress website and click on Submit.

Paste PushEngage API Key on WordPress website

The website will now connect to the PushEngage account. You can now change the settings from the WordPress dashboard, but for our article, we will follow the tasks given on the PushEngage website.

4. Set Welcome Notification

The fourth task is to set up a welcome notification for your subscribers. This notification will be shown after someone has subscribed to notifications from your website.

In the welcome message, you need to set a title and a message. For the URL, you can set it to the homepage or send subscribers to a specific page.

Setup welcome push notification WordPress

Make sure to check the ‘Send Welcome Notifications to Subscribers’ box and click on the Update button to save your changes.

5. Set Up Subscription Dialogbox

The fifth task is to set up a subscription dialogue box or the notification prompt that visitors will see when they visit your website.

You can find it from the task list or under Settings » Subscription Settings » Subscription Dialogbox.

Here, you get the option to choose the dialogbox style. You can preview to see how each one looks or click on edit to change its style.

pushengage subscription dialog box


We recommend that you choose the Single Step Opt-in as it is known to perform better compared to others.

After this step, the plugin will start working and your visitors should be able to subscribe to notifications from your website.

6. Upload PushEngage Files

The next step is to add package files to the root directory of our website. This is an optional step and not needed if you are using WordPress to send push notifications.

If you don’t have the plugin installed, uploading worker.js files to the root folder of your website will allow you to send notifications from your domain instead of the PushEngage subdomain.

7. Start Sending Push Notification

Once you have few subscribers, you can start sending them notifications.

To send a new notification, Click on Notifications from the sidebar and click on Create » New Notification.

Here, you need to type in the title and message for the notification. Next, you need to add the URL of the specific page you want to target and a custom image for the notification message.

Next, you can make use of some pretty neat features like Multi Action Notification and Notification Large Image that PushEngage provides.

Once that’s done, you can choose to send your notification now or schedule it at a later time. If you are on a paid plan, you can also schedule it to send according to the user’s time zone.

Review everything for once before clicking the Send Notification button.

That’s it! Your readers should now start receiving notifications from your website.

The plugin also comes with many automation features, but they are a part of the paid plans. You can upgrade to any of the paid plans and start using them.

Fix Your WordPress Emails Now

Next: Use TrustPulse To Show Social Proof

Social proof is another great way to increase conversion and sales on your website. TrustPulse shows notifications on your website about recent purchases or visitor activity.

This tells visitors that your product can be trusted and is quite popular on the market.

The setup process takes less than 5 minutes, and you can boost conversions by as much as 15%.

It integrates seamlessly with all popular e-commerce and email marketing platforms including WordPress, Shopify, WooCommerce, and many more.

Ready to fix your emails? Get started today with the best WordPress SMTP plugin. WP Mail SMTP Elite includes full White Glove Setup and offers a 14-day money-back guarantee.

If this article helped you out, please follow us on Facebook and Twitter for more WordPress tips and tutorials.

Add a Comment

We're glad you have chosen to leave a comment. Please keep in mind that all comments are moderated according to our privacy policy, and all links are nofollow. Do NOT use keywords in the name field. Let's have a personal and meaningful conversation.

This form is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.