When you read the term “push notifications” you probably think about the notices you get on your smartphone every time you receive an email or are mentioned in a tweet.
But while most of us are familiar with push notifications because mobile apps have been using them for years, you may not be aware that they’ve made the jump from smartphones to browsers and can now be delivered by any website.
When push notifications are used within the browser, they’re called web push notifications and I’m sure you’ve already encountered them. When you visit a site that sends notifications your browser will prompt you to allow notifications. If you allow them, you’ll be notified any time that website fires off a notification. As a matter of fact, we use web push notifications on this blog to let readers know when we’ve published a new post, so you probably get them from us unless you opted out (but I’m sure you wouldn’t do that!).
Web push notifications can be delivered to users of the desktop and Android versions of Google Chrome and Mozilla Firefox as well as users of Safari on OS X (desktop and laptop Macs, but not iPhones or iPads). Notifications are even delivered to users who aren’t using the browser when the notification is sent. In that scenario, the notification is stored until the next time the user opens their browser at which point the notification is delivered.
What Can You Do With Push Notifications?
You probably already use social media and maybe even send out a regular email newsletter. Do you really need web push notifications? Well, that depends.
Does your site post updated information on a regular basis? Do you want your users coming back to get updated information on a daily or near-daily basis? If so, yes, you really should look into push notifications.
Web push notifications are used to encourage repeat visits by site regulars. They are a particularly effective way to let users know about updated content and to get time-sensitive information in front of users as quickly as possible.
Let’s get practical. Here are three different types of sites that could benefit greatly from rolling out web push notifications:
- Blogs that publish useful content on a very regular basis (i.e. at least several times per week) can use push notifications to let their readers know as soon as new content is published.
- Sites that regularly post information that is highly time-sensitive, such as information about online flash sales, could get the word out to their subscribers a lot more quickly by rolling out web push notifications.
- News sites that publish breaking news can use push notifications to highlight their most compelling new stories.
What push notifications cannot do is completely replace marketing systems such as email newsletters, or function like a hello bar to manage on-site user experience. Instead, think of push notifications as a way to keep your most loyal site regulars as up-to-date as possible.
In addition, you should be careful to never abuse web push notifications since they are easy to opt out of. As a result, it is highly inadvisable to use web push notifications for blatant advertisement or to display affiliate offers. When you send a web push notification, make sure the content you’re delivering is compelling enough that your site visitors won’t be put off by the interruption.
How Do Push Notifications Work?
When someone visits a site that has set up push notifications they are prompted by a modal window to allow notifications. If they choose to allow them, their browser registers a script supplied by the website. While some websites may choose to develop their own custom push notification scripts, most websites will use a script supplied by a third-party push notification service provider such as PushCrew or OneSignal.
When the website wishes to push a notification to its subscribers, the push notification service provider delivers the notification to subscribers thanks to the script that was registered when each user opted in. Subscribers who are online when the notification is sent will see the notification in the lower right-hand portion of their screen immediately (or as a full-width notification if displayed on an Android device). Subscribers that aren’t using the browser when the notification is sent will see it the next time they open their browser.
Push Notification Services Worth Considering
There are lots of push notification systems that can be integrated with WordPress. After wading through the list of available options, I’ve honed in on four that offer a free tier, are relatively easy to set up, and have been vetted by at least a few hundred users.
Walkthrough: Adding Push Notifications with OneSignal
All of the notification systems mentioned in this article might be the right choice depending on your needs. PushCrew is easy to use and offers a seamless opt-in experience. With either PushEngage or PushAssist you can do everything you need to do from the familiar confines of the WordPress admin area. OneSignal is compelling because it’s incredibly feature-rich and the free plan is completely unlimited.
While all of the plugins listed in this article performed well, my vote goes to OneSignal. However, as the most feature-rich option in the bunch, the learning curve with OneSignal is a bit steeper, but if you’re willing to spend the time to learn how to use it, it’s the clear winner.
Having said that, OneSignal is the most complicated to set up. So let’s walk through the setup process together.
Step 1: Install the OneSignal Plugin
Access your WordPress website admin area, go to Plugins > Add New and search for “OneSignal”. Find the plugin, OneSignal – Free Web Push Notifications, which should be the first result, and select Install Now.
Once installation has completed, click Activate. If you’re installing the plugin on a multisite network, don’t network activate the plugin. Instead, go to the subsite where you want to use the plugin and activate the plugin from the subsite.
Once the plugin is activated, go to the new item added to the admin menu: OneSignal Push.
Step 2: Create a OneSignal Account and Add a New App
In a new browser tab, go to OneSignal and sign up for a free account. Once you’ve created an account, click the button to Add a new app. Name the app anything you like. From the next screen, select the Website Push option and click Next:
From the next screen, you will need to configure either Chrome and Firefox or Safari. For now, select Google Chrome & Mozilla Firefox. We’ll set up Safari a little later.
On the following screen, enter your site’s full URL and the URL for the image or icon you’d like to display with your notifications. The image needs to be square and at least 80 by 80 pixels. Since my test case was my own personal website, I just used a headshot, resized it to the correct size, and uploaded it via FTP to a folder of my website. In addition, if your site can resolve using http then you must select the checkbox specifying that My site is not fully HTTPS.
If your site is not fully HTTPS, after selecting the appropriate checkbox scroll down and choose a subdomain that will be used to collect opt-ins and deliver notifications. Then click Save.
From the next screen, select the WordPress SDK, and click Next. OneSignal will now display your OneSignal API key and app ID. Leave this browser tab open and head back to WordPress in a separate browser tab.
Step 3: Connect OneSignal to Your WordPress Website
In your WordPress dashboard, click over to the OneSignal Push menu item. Within that menu, select the Configuration tab. Copy the App ID and API key from OneSignal over to the appropriate fields, noting that the order of the fields is reversed in the WordPress dashboard as compared to the OneSignal dashboard. If your site resolves using http, enter the subdomain you created at OneSignal in the appropriate field.
There are many additional options that you can review in the Configuration tab. However, at this point, you’ve entered all of the settings that are necessary to enable notifications in Chrome and Firefox. Once you’re satisfied with the rest of the settings, click the Save button at the very bottom of the menu.
Step 4: Set Up Notifications
For this example I’ll show you how to set things up in Safari.Go back to OneSignal and log in. From the list of apps, select the app you created previously. From the left-hand menu, select
Go back to OneSignal and log in. From the list of apps, select the app you created previously. From the left-hand menu, select App Settings. Scroll down until you see Safari in the Web Platforms section, click Configure, and type in your site name and URL.
When you click Save the page will refresh. Scroll back down until you see Safari. Just below Safari, you will now see a Web ID displayed. Select and copy that ID.
Go back to your WordPress dashboard, navigate to the OneSignal configuration panel, and paste the Web ID in the field labeled Safari Web ID. Scroll all the way to the bottom of the screen and click Save.
Safari users on OS X will now be able to opt-in and receive your website’s notifications.
Step 5: Send Your First Notification
Your site should now be set up to deliver notifications. To test this out, visit your site front end from a supported browser and opt-in to notifications.
Next, go to the OneSignal dashboard and select your website from the list of available apps. Click on New Message in the sidebar menu. Add a title and a comment. Click on Options, select the Launch URL option, and type in a URL that you want the notification to link to.
To send the notification, click on the Preview button. If you’re happy with the preview, click the Send button at the bottom of the menu. If all goes according to plan, since you have already subscribed to notifications you should see a notification from your website in the lower right-hand portion of your computer screen.
Well done! You’re now ready to start using OneSignal to send push notifications to your subscribers.
Next Steps
There’s a lot more you can do with OneSignal notifications. From the notification creation menu take a look at the list of available options:
- You can create user segments and send notifications to users based on the segment they belong to.
- You can add buttons that are displayed to Chrome users who receive your notifications.
- You can schedule notifications to go out at a later point and set notifications to be delivered based on the receiver’s time zone.
- You can even perform A/B testing with a small random sample of subscribers, settle on the most effective notification copy, and deliver the winning notification to your entire subscriber base.
Take the time to learn your way around OneSignal and you’ll be surprised at how much notification flexibility and analytics data is at your fingertips.
Wrapping Up
Push notifications are no longer limited to smartphones and mobile apps. When used effectively, they can be a boon to website owners by driving return traffic, serving as a method to deliver time-sensitive notifications, and notifying site regulars about updates as soon as they go live.
There are several excellent web push notification systems that integrate with WordPress quickly and easily so that you can begin boosting your site’s returning visitor traffic by leaps-and-bounds.
View original post at WPMU
