How To Send Push Notifcations With WordPress

  • By Darrel Wilson
  • Last Updated: November 23, 2019

How to Send Web Push Notifications with WordPress?

Have you ever observed the web push notifications being used on famous sites like Facebook, YouTube, LinkedIn and many others?

If you would visit the trending websites, then you can observe a box-like menu on the top left corner reflecting some kind of notifications from that site.

To your ease, it is quite simple to add and send web push notifications with the help of WordPress. Web push notifications with WordPress have the power to work ten times better than any of your marketing strategies.

In this tutorial, you will learn about the step-by-step process to setting up the web push notifications with WordPress. To top it all, it will be made possible for free.

Why Add or Send Web Push Notifications with the WordPress Site?

Web push notifications serve as clickable icons or messages that are displayed on the top corner of the desktop of the users. These notifications can be displayed even when the users have not opened their desktop. In addition to the website browsers, the notifications are also displayed on the mobile browsers.

Famous websites like Facebook, LinkedIn, Pinterest, and several others make use of the web push notifications for enhanced user engagement. The web push notifications serve to be highly engaging and converting than normal messaging, email marketing, and various other sources of social media marketing.

As per a recent survey, web push notifications have generated more than 50% success rate on the mobile appliances. This implies increased engaged audience on the WordPress site along with significant boosting in the overall page visits and returning customers.

Setting Up Personalized Web Push Notifications with OneSignal in WordPress

OneSignal is a completely free online service that enables the WordPress website owners to include and send web push notifications to several web, websites, or even mobile apps. This free service can work magic for you by creating a good number of conversions on a daily basis.

Every time you make a post, your audience will get notified on their browser about your latest post. If you wish to use OneSignal for sending web push notifications with WordPress, you can follow the simple series of steps as:

Step 1: To start using OneSignal for sending web push notifications, you will have to, first of all, install and then, activate the plugin of OneSignal on your WordPress site or web browser.

Step 2: Once you have activated OneSignal plugin on your browser or site, you need to advance to Login. If you have not created an account with OneSignal, then you need to sign up by entering your email, password, company or organization name, and by agreeing to the given terms & conditions, you can sign up with OneSignal. Using the credentials, you can now log in to the OneSignal page.

Step 3: Once you enter the main dashboard of OneSignal, it shows the number of conversions you have made on a daily basis.

Step 4: You also come across a menu that says “Add a New App” on the dashboard. You can click on the “+” sign. A box would appear wherein you have to enter the app name and then, click “create” to add the same.

Step 5: Once you have created a new app, a subpage will appear that asks you to make some editing to your newly created app. You can close it for now.

Step 6: From the main dashboard, you need to go to App Settings. A subpage appears that displays a lot of menus like platforms, administrations, Keys & IDs, and Import Users from Another Service.  Under the Platforms column, you would observe the option “Google Chrome and Mozilla Firefox”. You can set the web push notifications for the main web browsers like Google Chrome, Mozilla Firefox, and Apple Safari.

Step 7: Right next to each of these options, you can click on the option “Configure” for enabling your web push notifications on the desired web browser. On the “Configure Platform”, you need to enter the URL of your site.

Under the section “Default Notification Icon URL”, you can get it from your library. From the dashboard of your site, go to Media from the left menu, and then head to Library. You can click on any image, copy its URL and then paste it in the box “Default Notification Icon URL”. Whenever you will be sending the web push notification, this image with the URL is going to show up on the user’s browser. Therefore, you must ensure that the image is appropriate and its represents your website. Then, click on “Save”.

Step 8: Next, head to Keys & IDs column on the App Settings. Here, you just need to copy and paste the given OneSignal App ID onto your site’s plugin icon. So, head back to the dashboard of your WordPress site, go to Plugins > Add New.

Step 9: In the Keyword Search Bar, search for OneSignal Plugin. Click on “Install Now” icon next to the plugin name. Once it is installed, refresh your site’s dashboard. It will now display “Active” status. Once active, you can see the “OneSignal Push” on the bottom left menu of your dashboard.

Step 10: Click on “OneSignal Push”. Now, copy the OneSignal App ID from the OneSignal “Keys & IDs” section. Now paste that under the App ID section in the Account Settings of OneSignal Push. Repeat the same for the REST API Key.

Step 11: Now, scroll down. You can change the Notification Title as per the one that represents your business. Another important thing to check out here is the “Automatically prompt new site visitors to subscribe to push notifications”. You can toggle it on as whenever anyone visits your site, it will automatically pop up and notify the users about your postings and offers right away. You also need to check on the option that says “Send notifications additionally to iOS & Android platforms”.

Step 12: There are various options of customizing your web push notifications. You can change the size, position, the theme, and so more. With this dashboard and App Setting of your OneSignal Push, you are in full control of the web push notifications that would be sent through your WordPress site. When you are done customizing the push settings, you can scroll to the bottom of the page and hit “Save”.

Setting Up Web Push Notifications for Apple Safari Web Browser

Now that you have set up web push notifications for Google Chrome & Mozilla Firefox, you also need to set it up for the Apple users. To do it, go to the Platforms icon of the OneSignal Dashboard. Here, click on “Configure” option corresponding to the Apple Safari web browser. It works in the similar manner to that of Google Chrome & Mozilla Firefox web browsers.

Step 1: Enter your site name. Then, enter the site URL. Scroll down and hit the icon “Upload by Notifications Icon”. Choose the desired icon from your website, and Click on the Save option.

Step 2: On the Platforms page, under the Apple Safari web browser, you get a key. You can copy the key and go back to the OneSignal Push option on your site’s dashboard. Scroll down, under the option Safari Web ID, just paste the copied key. Now, hit Save at the bottom of the page.

Posting Web Push Notifications with WordPress

Now if you wish to test the OneSignal free service for sending web push notifications with your WordPress site, you can do it with much ease.

Step 1: Just head back to your site’s dashboard. On the leftmost menu, you will see “Post” option. To make a post, enter the desired title. Enter a detailed description of the post in the box below. You can also make use of some editing tools to enhance the given post. Post a picture as well by clicking on the option “Add Media”. Make sure you have checked the option “Send notifications on post publish” on the right corner of the page. Click on “Publish” to send the web push notification.

Step 2: Go back to your site. You will observe the notification on the top right corner of your browser. When you click on it, you will be directed to the post directly.

Thus, you have enabled the web push notifications with your WordPress site with the help of a highly handy tool “OneSignal plugin”. You can use it to send push notifications on Google Chrome, Mozilla Firefox, and Apple Safari web browsers and even mobile applications.


We hope this article helped you in learning about how to send web push notifications with WordPress site. The web push notifications can be sent to a particular segment of your targeted audience. You can also schedule to send it on a particular time of the day or night. Web push notifications sent through your WordPress site can play a major role in increasing user engagement and daily conversions on your site. Make use of this high-end feature and experience the joys as you see your online business reach newer heights.

About The Author

Darrel is a wordpress promoter who teaches free wordpress tutorials on Youtube, Udemy, And SkillShare. He enjoys hiking, trying asian food, and taking his dog to the beach. He continues to provide free tutorials for wordpress themes, digital marketing, and wordpress plugins. He is currently the highest rated instructor on

Leave a Reply

Hi, Sign Up For Freebies And Wordpress News!

Hi, Sign Up For Freebies And Wordpress News!

Join My Mailing List For Tips, News, And Discounts!

You have Successfully Subscribed!

Subscribe To Our Newsletter

Subscribe To Our Newsletter

Join our mailing list to receive the latest news and updates from our team.

You have Successfully Subscribed!