The most difficult task for any blogger is to gain returning customers. People visit our site and leave and the majority of them do not ever come back. We use sign-up forms and newsletters to target our visitors but the conversion rates of these conventional methods are much less as compared to web push notifications. Many website owners keep themselves away from push notifications due to the mere misunderstanding about its complexity. In fact, it is quite simple to add push notification to WordPress site and this does not involve any code change. Let us now see in detail about push notifications and how to implement it in our WordPress site
What is a Push Notification?
Web Push Notifications allow website owners to automatically notify the audience via browsers such as Chrome, Firefox, Safari, and Edge. Web push notifications are delivered to the user’s desktop or mobile device regardless of whether or not the user is browsing our website. Some of the popular use cases for Web Push Notifications are
- Activating dormant users with customized offers
- Retargeting users with abandoned shopping cart
- Delivering customized offer to users based on behavior
- Price drop notification on a favorite or popular product
The greatest advantage of Web Push Notification over emails is its high open rate that ensures a strong user engagement. They also have a lower cost when compared to email marketing campaigns, meaning that our ROI will be high. This will enable us to run more powerful campaigns. Also, push notifications are not affected by AdBlockers on our browsers.
How to add Web Push Notification to WordPress for Free?
OneSignal is the most popular free web push notification service available for WordPress websites. OneSignal supports the following browsers and OS.
As we can see from the above table, One signal supports push notifications in all major mobile browsers as well.
For adding OneSignal push notification to WordPress, we need to install and activate the OneSignal Web Push Notifications plugin. This plugin has more than 100,000+ active installations.
After activation, we could see a new menu OneSignal Push in the admin dashboard.
Once we click on this menu we could see the OneSignal dashboard. This section is divided into two tabs Setup and Configuration. The Setup tab is basically documentation on how to enable push notification on WordPress using this plugin. Once we navigate to the configuration section we can see that the plugin requires App ID, REST API Key, and Safari Web ID.
Signing Up For OneSignal Push Notifications
Let us first obtain these values before continuing with the configuration. We can get these values from OneSignal portal after signing up for their service. The free plan supports unlimited mobile app notifications and Web push notifications for up to 30,000 subscribers. Go to OneSignal website to sign up for their free plan.
After signing up and successfully verifying our email address, log in to OneSignal portal. Now click the ADD APP button to create our app.
Now enter a name for our app. The name is just for us to identify where we are using OneSignal push notification and hence is not much important.
Now we need to select the platform where we are enabling these push notifications.
As we are trying to enable push notification for browsers we have to select WebPush option and click the Next button. The next step is to select the platform of our website. Select WordPress Plugin or Website Builder option and then select WordPress as our CMS platform.
The next step is to enter our site name and site URL. The site name is just for identification purpose and hence is not important. The site URL should be our complete URL. Also, upload our site logo as the default icon URL.
Push notifications are only supported on a secured HTTPS connection. So if our site is not fully HTTPS then we have to turn the toggle button to ON state and enter a label name.
Once we enter these values and click the Save button we will get the APP ID and API KEY.
Configuring OneSignal Push Notification Plugin
Now let us go back to the plugin configuration section and enter these values. For the time being, we do not need Safari Web Id.
After filling in the keys click the Save button at the bottom. Now let us visit our website in incognito mode on chrome browser.
We can see a simple browser notification prompt. There are two basic problems with this kind of default prompt. One it is not visually appealing and secondly, there is no provision for the user to enable the push notification if he has blocked it before. OneSignal has some advanced options that help us to resolve both of these issues. First, let us make our notification prompt more appealing. For this go to the HTTP Pop-Up Settings section of our plugin configuration. Here enable the Customize the HTTP Pop-Up Prompt text slider to ON. Also, provide a custom message to appear in the notification prompt bar.
Now click the Save button at the bottom. Let us again visit our site in incognito mode to see the change. The dull default notification prompt has been transformed into a visually attractive bar.
Let us also see how mobile push notification is working.
Now let us provide our visitors a chance to re-opt-in for notifications if the user has initially blocked it. For this, we have to go to the Prompt Settings & Subscription Bell section of our plugin configuration.
Here we to enable the Subscription Bell slider. Once this is enabled the subscription bell icon will be shown on our website which can be used by visitors to manage their subscription status.
Sending Test Notification from OneSignal Dashboard
Go to Users section in our OneSignal Dashboard. As we have already provided push notification access from our browser we will be in the list of users. Now go to Options under Actions and click Add to Test Users.
In the next screen also provide a name for the test user for our ease of use.
Now go to the homepage and click Send a Push Message link.
On this page select the option to send push message to Test Device and select the previously added name.
Also, provide some value for message title and content. Now send the test push notification by clicking the Confirm button.
Now we will immediately get a notification in our browser.
We can also view the details of this push notification from OneSignal dashboard under the Delivery section.
Configuring Push Notifications from WordPress
We can configure to send push notifications directly from our admin section while we publish a new post. For this go to the Automatic Notification Settings in the plugin configuration section and enable this option.
Also under Sent Notification Settings section, we have options to use the featured image of the post as the notification icon. This helps in improving the click-through rates.
If we want to disable notifications for some posts we can uncheck the Send Notification on post publish checkbox in the post create section.
Configuring Apple Safari Web Push Notification
While we started working with the configuration on our plugin dashboard we ignored the Safari Web ID key. We only created APP ID and REST API Key from OneSignal dashboard. These settings will work for only browsers except Safari. We have to do some additional configuration for enabling push notification in Safari. For this go settings section of OneSignal dashboard click the edit link to the right of Apple Safari link under Web Push Platforms.
Here we have to provide our site name and site URL. We can also upload our custom notification icon. Then click the Save button at the bottom.
Now we will be redirected back to the settings page. Click on the Apple Safari link to obtain the Web ID.
Now we have to again go back our WordPress plugin dashboard and add this key to the Safari Web ID section. Also, do not forget to click the Save button at the bottom.
Now we have successfully enabled web push notification for Apple Safari Browser also.
Alternative WordPress Push Notification Plugins
Although OneSignal seems to be an ideal choice when it comes to WordPress push notifications, I would like to mention some other really useful alternatives.
1) PushEngage
This is a popular web push notification service provider in the market. They also have created a WordPress plugin for ease of WordPress integration. Their free plan allows up to 2,500 subscribers and 120 notifications per month.
2) PushCrew
They have a free plan which allows up to 2000 subscribers. They also have a WordPress plugin, but this has not been updated for the latest versions of WordPress.
3) PushAssist
This is another popular push notification service provider which supports up to 3000 subscribers for free. They also offer a WordPress plugin for easy integration of their service.
Leave a Comment