Web Push Notifications with OneSignal
Description
Push notifications are clickable messages that pop up on your phone or desktop with some content. Typical types of push notifications include promotional info such as a new blog post, new release, a Black Friday sale, etc. or tranansactional info such as new message received, a friend liked your comment, your driver is on their way, appointment reminders, etc.
Discussion
Alpha Anywhere includes support for web push notifications through an integration with OneSignal. Web push notifications are supported by most desktop and mobile browsers.
OneSignal is a unified messaging service that supports web push, email and SMS notifications.
Benefits of using OneSignal Push Notifications
Enhanced User Engagement and Retention
OneSignal push notifications significantly improve message visibility, helping apps and websites stay top-of-mind for users. This leads to increased user retention and engagement, as notifications can re-engage inactive users and keep them informed about important updates, offers, or content.
Case studies show dramatic results, such as a 140% increase in paid user reactivation after implementing OneSignal.
Boosted Conversions and Revenue
Push notifications are proven to drive conversions by prompting users to take desired actions, such as making a purchase or returning to the app. OneSignal is widely adopted for its effectiveness in increasing conversions and fostering user loyalty.
Advanced Personalization and Targeting
OneSignal offers robust segmentation tools, allowing businesses to send highly relevant and personalized notifications based on user behavior, demographics, location, and engagement patterns. Targeted notifications achieve a 21% higher click-through rate (CTR) compared to generic messages.
Features like Data Tags and A/B testing further enhance campaign performance, with Data Tags boosting CTR by 58% and A/B testing improving CTR by 8%[6].
Omnichannel Communication
OneSignal supports multiple messaging channels, including mobile and web push notifications, in-app messaging, SMS, and email. This comprehensive approach enables business to reach users on their preferred platforms and devices, streamlining communication strategies.
Automation and Workflow Efficiency
The platform provides automation features, enabling businesses to trigger notifications based on user actions, time-based events, or custom workflows. This saves time, reduces manual effort, and ensures timely delivery of relevant messages.
User-Friendly and Developer-Friendly
OneSignal is recognized for its intuitive interface, easy setup, and simple API, making it accessible for both marketers and developers. It integrates seamlessly with popular platforms and supports various tech stacks, allowing for quick implementation and customization.
Reliable and Scalable Delivery
With nearly 100% uptime and the ability to handle billions of messages daily, OneSignal ensures reliable and timely notification delivery, which is critical for time-sensitive content and large-scale operations.
Comprehensive Analytics and Insights
OneSignal provides detailed analytics to track campaign performance, user engagement, and message effectiveness. These insights help businesses continuously optimize their notification strategies for better results.
Cost-Effective Solution
The platform offers reasonable pricing and free account options, delivering great value for businesses of all sizes by combining a wide range of features with affordability.
Strong Customer Support
Users consistently praise OneSignal's responsive and helpful customer support, which assists with onboarding, troubleshooting, and maximizing the platform's capabilities.
In summary, OneSignal push notifications offer a powerful, flexible, and scalable solution for engaging users, driving conversions, and managing omnichannel communication with advanced targeting, automation, and analytics—all in a user-friendly and cost-effective package.
Creating an app in OneSignal
If you prefer to watch a step by step video on this topic see: OneSignal Signal Web Push Integration
Head over to the OneSignal website to setup a free account.
Click the Get Started Now button.
Once you have setup your account click on the New App button from your organizations dashboard.
Next, fill in your the name you want to use as your OneSignal app name and select your organization, then select Web for the first messaging channel.
On the Site Setup dialog enter your site name. OneSignal requires the production site url to use the https:// protocol however for testing your app with Alpha's local development server you can enter http://localhost(:port if other than 80). This makes it simple to test your app with OneSignal. Be sure to enable "Treat HTTP localhost as HTTPS for testing" as shown. You can also upload a default icon for the push notifications. The recommended size is 256 x 256px.
Setup your push notification prompt.
From the Advanced Push Settings dialog, you need to enable "Customize service worker paths and filenames" to customize the location of the OneSignal service worker as required by the Alpha OneSignal integration.
Be sure to define the Path to service worker files and Main service worker filename, Updater service worker filename and the Service worker registration scope as depicted below. You can also moidify the behavior when the user clicks on the push notification message.
You do NOT need to download the OneSignal SDK files. The required SDK file will be automatically loaded by the Alpha app builder if the project is configured to use OneSignal.
You do NOT need to add any code to the site but you do need the app id. Copy the app id to the clipboard.
Next, from within the Alpha Anywhere Web Control panel, paste the app id from the clipboard to the Web Project Properties dialog as shown below.
Your app should now be properly configured to test with OneSignal.
Testing with an Alpha Component
You can now test the OneSignal push integration by opening a component in LivePreview and after 10 seconds, you should see the OneSignal notification prompt that you previously configured.
The OneSignal notification prompt will be followed by the browsers native authorization prompt. Once you have allowed notifications, you will see the welcome notification in the lower right corner of your screen.
Resetting App Permissions
Sending Out Your First Push Notification
For a full playlist of videos covering the Alpha Anywhere / OneSignal integration see: OneSignal Signal Web Push Playlist
Limitations
Web, Mobile Web and Progressive Web Applications Only









