How to Send Browser Push Notification from Wordpress

jignesh kumar
Sep 2, 2018 · 4 min read

Push-notification-in-wordpress

Push-notification-in-wordpress

In this tutorial, we are going to setup browser push notification for WordPress site using oneSignal service for free.

so, let’s get started…

Push notifications are messages that come from a website. You get them on your desktop or device even when the concerned web page is not open in your browser.

Setting up Web Push Notifications in WordPress with OneSignal

OneSignal is a free service that allows you to add push notifications to any website, web, or mobile apps.

To setup OneSignal push notification in WordPress, you have to add related API keys and Application IDs into the plugin settings.

So, Let’s get started.

Step-1 :

Go to OneSignal and create a free account.

Step-2:

Click on “Add a new app” and enter your app name. In our example, we are simply using the name of our WordPress site. Then click on “Create.”

Step-3:

Select “Web Push” and click “Next.”

Step-4:

On the next screen, you will need to select your target SDK, so we will select “WordPress” then scroll to the bottom and in WordPress site setup section enter your WordPress Site Name and Site URL.

According to OneSignal, icon dimensions should be 192 x 192 or larger to display well on high pixel density devices. The default OneSignal notification icon will be used if you don’t choose one. Then click “Save.”

Step-7:

Now you will able to see your API Key and App ID on next screen On the next screen, copy your Rest API key and App ID as you will need to input this information into the settings of the WordPress plugin.

Step-8:

Now Go to your WordPress site then Download and install the free OneSignal plugin.

You can download it from the WordPress official site or by searching it within your WordPress dashboard under “Add New” plugins menu

step-9:

After install done, click into the “Configuration” tab of the OneSignal Push settings. Enter your App ID and API Key which you have got from OneSignal and click “Save.”

step-10:

You will then want to browse to your website and subscribe to the notification to test that everything is working correctly. Click on the “red bell” symbol on the bottom right and click on “Allow.”

You will see a confirmation and click on “Allow”.

Automate push notification on post publish

By default When you install the OneSignal WordPress plugin, it enables the option to “send notification on post publish” automatically. If You don’t want getting pushed then easily un-check this option.

Customization

You can also click on the Options, Segment, Schedule/Send Later to further customize your web push notification.

Conclusion

Thanks for reading.

That’s it from now you are ready with push notification implemented on your WordPress site, We hope this article helped you add web push notification your WordPress site.

Do let me know If you face any difficulties please feel free to comment below we love to help you.if you have any feedback suggestion then please inform us by commenting.

Don’t forget to share this tutorial with your friends on facebook, twitter and Google+.

Related


Originally published at www.tutscoder.com on September 2, 2018.

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade