When site members choose to receive immediate notifications. In addition to email notifications, they will also have the option to subscribe to Web Push notifications. Web Push notifications can be delivered even when the person is no longer on your site.
Create a OneSignal App
The first step to configure OneSignal in EngageUsers is to create a free OneSignal account and create an App to use with the Add-on.
Create OneSignal app
Web Push Platform
Select the Web Push platform.
Setup webpush platform
Custom Integration
For integration select Custom Code.
Webpush custom code integration
Site Details and Custom Icon
Next, fill out the Site Name and Site URL, and set the default icon to use for notifications.
Webpush site setup
OneSignal SDK
In this step download the OneSignal SDK. Next, unzip the downloaded package and upload the 3 files to the root of your site. To confirm the files are readable, try accessing them directly using the browser. Replace your domain in the following links and you should be able to see the file contents:
├── https://my-jreviews-site.com/manifest.json
├── https://my-jreviews-site.com/OneSignalSDKUpdaterWorker.js
├── https://my-jreviews-site.com/OneSignalSDKWorker.js
Download and install OneSignal SDK
App ID and REST Api Key
Get your App ID and REST API Key from OneSignal under Settings / Keys & IDs
The highlighted keys in the image below are for documentation purposes and will not work. You need to use the ones provided in your OneSignal dashboard.
Copy OneSignal App and API keys
Copy the App ID and REST API Key to the 3rd Party Integrations tab in the Add-on admnistration.
Add App and API keys to Add-on setup
Safari Notifications
Safari notifications require a different Web Id. On your App in the OneSignal site go to Settings / Platforms / Apple Safari.
Safari Webpush Settings
Add the Site URL, then save.
Safari Webpush URL
Now, click again on Apple Safari.
to re-open the dialog and copy the generated Web ID to your site under EngageUsers / Configuration / 3rd Party Integrations.
Upload Custom Icon for Safari
On the OneSignal site, in the same dialog where you copied the Web Id for Safari you will now see a checkox at the bottom to set a custom icon for Safari Web Push notifications.
Set the Safari icon at this point because once users are subscribed, they will only be able to see the icon that was set at the time they subscribed. If you didn't set an icon, that would be the default OneSignal icon.
Safari Webpush Icon
Learn about admin notifications via Slack →