How to Add Web Push Notifications On WordPress 2021

How to Add Web Push Notifications On WordPress 2021

Update: TruePush is not a free service anymore 🙁

I love push notifications because it helps me a lot in getting the returning visitors on my website.

The users don’t need to subscribe and give a lead to sign up and to get started.

Users need to click on the allow, and that’s pretty much it.

I was using OneSignal on many of my personal websites, and then the tool got paid for all the users.

If you have less than 30k subscribers, you don’t need to pay anything.

But

If you have more than 30k, then you need to pay $99 for push notifications.

Now, there are chances if you’re starting a blog for the first time, you won’t have many visitors, but in the future, you will have more people coming to your website.

If you’re someone who plans big? (Like me :P)

I will always suggest you go with something reliable in terms of analytics, support and service.

So if you want to get started with push notifications, let me tell you about my personal favourite tool, and that is TruePush.

But wait a second.

Before that, let’s talk about what is a push notification?

Add Web Push Notification on WordPress

What are Push Notifications?

Whenever you visit any website, you might have seen this notification asking you that the website wants to send you notifications.

Add Web Push Notifications On WordPress

When you allow the notification, the website owner can send you notifications of the latest articles, updates, coupon codes, or offers.

Add Web Push Notifications On WordPress

The best thing about push notifications is that the users won’t be giving their lead, which helps you a lot in getting more subscribers.

Now, let’s try to understand this tool and how can we send the notifications.

The name of the tool in TruePush

TruePush Push Notification

TruePush is a website that helps users subscribe to add web push notifications, and that too for free.

You don’t need to pay a single penny to get started.

Not just that, there are no limits on notifications that means you can send unlimited notifications to anyone.

Apart from you will be able to create segments, mobile push notifications, templates, and much more.

If you’re someone who is publishing a lot of content on WordPress, then you can also enjoy a feature called RSS to Push notification.

That means you don’t need to send the notification manually because RSS to Push feature will automatically take care of everything for you.

One of my personal favourite features of true push is that there are no limit that means unlimited subscribers + unlimited push notifications.

Features

  • Real-Time Reporting / Analytics: You get the data from which locations the users are subscribing to push notifications. You will also get the real-time data of the users subscribing to push notifications.
  • Multi-browser support: You can enable push notifications for Google Chrome, Firefox, and Safari.
  • Unlimited Subscribers: You don’t need to worry about the limits anymore.
  • Super Fast Delivery: You can send notifications in just a few seconds.
  • Segmentation: You can create segments that will help you send a notification to users based on their browsers, country, or state. (Recommended if you have website visitors coming from different parts of the world)
  • Unlimited Web notifications: You can send unlimited notifications and without any limits.
  • Unlimited Mobile notifications: If you have an app, you can use this feature to send push notification to the people who are using your app.
  • Scheduling notifications: If you wish to schedule push notifications to send at a specific time, you do so with a few clicks.
  • Unlimited Websites/Apps: Do you have multiple websites? No worries because there is no limit in terms of websites or apps.
  • RSS to Push notification: Are you publishing a lot of content on your website? Sending notifications manually can be a time-consuming process. You can add an RSS feed, which will help you send the notification without worrying about anything.
  • Support: You will be getting chat-based support. If you’re stuck somewhere, then truepush can help you with anything you like.

How to Add Web Push Notifications On WordPress

  • Firstly you need to signup for TruePush.
Add-Web-Push-Notification-On-WordPress-2
  • You need to add your personal information like your full name, email, and password.
  • Then you will need to create a new project. I will first suggest you give your project a name; it can be anything like.
  • Choose the platform type as the web.
  • Then you need to enter your domain name and the type of your domain name. For me, I am choosing “HTTPS://” because I have a free SSL certificate from webverge.
Add-Web-Push-Notification-On-WordPress-2
  • Then you need to add the logo of your website. If you don’t have one, then you can create it from Canva.
  • The next thing you need to choose is the opt-in style. My personal favourite is browser default, but you can select the one you like the most.
Add-Web-Push-Notification-On-WordPress-2
  • Then you need to choose when do you want to show this notification? After 0 or 10 seconds. I like to keep it for 0 seconds.
  • You don’t need to change any other settings.
  • If you wish to add a welcome message, you can also add that, it depends on you.
Add-Web-Push-Notification-On-WordPress-2
  • If you wish to add push notification for safari, you can add that, but the problem with that it is a very complicated process + you will need to buy the p12 certificate to get started. If you want to get that certificate you need to pay Apple.

The next thing you need to focus on is the integration with your website. This process can be a little complicated but don’t worry. I will quickly explain how to get started.

How to Integrate TruePush With WordPress

  • TruePush will share the sw.js file you need to upload in the backend of your website.
Add-Web-Push-Notification-On-WordPress-6
  • I will suggest you open your cPanel and go to file manager.
Add-Web-Push-Notification-On-WordPress-6
  • Then you will need to open the public_html folder.
Add-Web-Push-Notification-On-WordPress-6
  • You will see an “Upload” button, which will help you upload the file in your website directory.
Add-Web-Push-Notification-On-WordPress-6
  • Now, you need to upload the file, and that’s pretty much it.
Add-Web-Push-Notification-On-WordPress-6
  • The next step is to verify if you have uploaded the code correctly or not. Just open “example.com/sw.js” If you see some code written there, that means it worked fine. If you see a 404 error, that means you might have made a mistake in uploading the file.
Add-Web-Push-Notification-On-WordPress-22
  • The next step is to copy the Truepush code on the header of your website.
  • If you’re someone who is using Divi Theme, then I will suggest you go to “Divi → Theme Options → Integration → Add code to the <body> (good for tracking codes such as google analytics)” and paste the code.
Add-Web-Push-Notification-On-WordPress-11
  • If you’re not using Divi, you can install Header and Footer plugin on your website.
  • Go to Settings → Header and Footer, and then paste the code in the body of your website.
  • Once you’ve configured everything, the next step is to check if everything is working fine.
  • I will suggest you clear the cache of your website and then open your site in a new window, and there are chances you will get the notification asking you to allow push notification.
Add-Web-Push-Notification-On-WordPress-11
  • Once you see that, then that means you have configured everything correctly on your website.

We have setted up the push notification. The next step is to send the notification to your subscribers.

How to Send Push Notification to Your Subscribers

Now, we have successfully registered our website and set up everything correctly. The next thing we need to figure is sending the notification to the users on our website. 

  • You will first need to click on the “Send Notification” button.
Add-Web-Push-Notification-On-WordPress
  • Then you will need to enter your website URL, notification title, and notification message. Make sure you’re writing less copy here because not many people will read the complete message.
Add-Web-Push-Notification-On-WordPress
  • If you have a logo, I will suggest you upload that on truepush.
Add-Web-Push-Notification-On-WordPress
  • The next is notification data; it can be helpful if you want to track the UTM parameters. You can verify how many people came from the notification using Google Analytics.
Add-Web-Push-Notification-On-WordPress
  • If you wish to add buttons in the notification and send them to a different page, you can also do that with this feature.
Add-Web-Push-Notification-On-WordPress
  • Here can pass additional data from the TruePush notification to the user.
Add-Web-Push-Notification-On-WordPress
  • Do you want to schedule the notification? You can use this option to schedule the notifications.
Add-Web-Push-Notification-On-WordPress
  • Finally, the last one is to send the notification to a segment of the users based on their browser, country, location, etc. If you wish to do that, then you can also do that. Once, done you can click on the Send notification button, and that’s pretty much it.
Add-Web-Push-Notification-On-WordPress

Some Tips For Sending Notifications

Whenever you’re sending a notification to the visitors, you always need to remember one thing.

The notification time

You need to be smart.

I will always suggest you send the notification at 3 or 6 pm because many people are just scrolling to instagram, and they’re not doing anything.

Ofcourse, a lot of these things depend on the niche you’re in.

Suppose you’re someone who is sending the notification late at night. In that case, there are chances your subscribers will skip your website and do something else because the notification might get lost in a trail of notifications they’ve received in the morning.

I will always suggest you create the segments of the users based on their location. It will help you a lot to send the notification to the maximum number of people, and it will also help you gain a lot of clicks.

Do you have any other tips? I’d love to hear from you. You can drop a comment below.

Conclusion:

Yes! True push is free, and we don’t know till what time it will be free.

I have been using TruePush from last 7 to 8 months now and I am very happy with their service.

Push notification is one of the best things you can install on your website.

It helps users to remember your website forever.

When you’re using a push notification tool, you also need to remember to not spam.

If you’re sending multiple notifications, it can backfire, and you will get a lot of unsubscribers.

Do you have any questions or tips you want to share?

You can ask me below, and I will be replying to your comment in 4 to 6 hours.

Thanks for reading, and don’t forget to share the article with your friends also don’t forget to check out our web hosting company and other WordPress articles.

Share on:

I am the founder of WebVerge. I have 5+ years of experience in WordPress. I always write about the things I am obsessed with tech, WordPress and SEO. I am also a digital marketing trainer at IIDE.

2 thoughts on “How to Add Web Push Notifications On WordPress 2021”

Leave a Comment