Onesignal Integration

OneSignal Push Notification Integration

You may find the settings at EasyArticles > Settings > Integrations > OneSignal Integrations.

After you've successfully configured OneSignal integration, all visitors of your site will be receiving push notification notice on the first time their visit and will be continue receiving all notification generated by your site.

Setting Up OneSignal

OneSignal is a reputable push notification provider that allows you to deliver push notifications to your users for free. Before you're able to start using OneSignal push notification, you're required to register for an account with OneSignal and then create new OneSignal Application for EasyArticles.

Once you have logged-in to your account, you will be presented with this layout. Its shows all the available applications under your account. If you're new here, a guided setup will be appeared and it will help you setting up your first application with OneSignal. The guided setup is pretty simple and straightforward and we would like to encourage you to utilize the guided tour while setting up your new application in OneSignal.

Add New App

For the initial step, you may start your journey by clicking on Add a New App button as shown in following screenshot. After you have clicked the button, there will be a dialog prompted requesting for the App Name. Enter the desired app name of the new app and then hit Create button to continue.

Platforms

There are several platforms available for OneSignal application but our only focus here is Website Push notifications. EasyArticles utilizes this platform in order to send notification on web browsers. Click on it to select and hit Next button to start configure the platform.

Website Push notifications platform are divided into 2 sections named; Google Chrome & Mozilla FireFox and Apple Safari. In this documentation, we will provide you with a simple guide to setting up both sections.

Google Chrome & Mozilla Firefox Website Push Notification Configuration

There are several fields that are crucial in configuring this application and those fields are being highlighted below.

• Site URL
  This field is used to validate the identity of the site requesting push notifications using your ID. Only sites matching the field entered can use your OneSignal ID for push notifications.
  Your site URL should not include anything after your domain extension and must contain the protocol (e.g. http:// or https://).
  Further information can be accessed through OneSignal Web Push SDK Setup.

  If your site is fully support HTTPS, you may skips the following fields by uncheck My site is not fully HTTPS checkbox.

• My site is not fully HTTPS
  If your site does not support HTTPS or serves some pages over HTTP and other pages over HTTPS, then enable this HTTP Fallback option. Otherwise (fully support HTTPS), leave this option unchecked.

• Choose Subdomain (HTTP Fallback Option)
  Because of Chrome push notification requires sites to be using HTTPS, non-HTTPS websites must then use a subdomain of onesignal.com. Choose an unique subdomain (e.g. yoursubdomain), which will be displayed as https://yoursubdomain.onesignal.com.
  Warning: Changing this value after it's set will prompt users to accept notification permissions again.

After you have completed filling in the required fields, click on Save button to store the information and continue to the next step.

Select Target SDK

In this step, you will need to select the target SDK. Since EasyArticles utilizes Website Push so, you will need to choose it from the list and click on Next button to continue.

Install SDK

Yey, you're almost finish. Copy the generated App ID here and paste it in EasyArticles OneSignal Push Notification Integration which can be found at EasyArticles > Settings > Integrations > OneSignal Integrations. Once you're ready, click on Done button to close the dialog or X at the top right of the dialog.

Configuring EasyArticles OneSignal Integration

Navigate to App Settings on OneSignal sidebar and click on Keys & IDs tab. In here, you will find the OneSignal App ID and REST API Key. The OneSignal App ID should be the same as the previous step. Copy REST API Key and paste it in EasyArticles OneSignal Push Notification Integration which can be found at EasyArticles > Settings > Integrations > OneSignal Integrations.

Double check the App ID with the OneSignal App ID and make sure it has the correct ID.

Additional Steps For HTTPS Website

If your site is using HTTPS, OneSignal requires you to upload these 2 files into your root directory. It is a compulsory requirement from OneSignal. You may directly download them by clicking on OneSignalSDKFiles.zip or you may view them from OneSignal Documentation site.

Unzip the OneSignalSDKFiles.zip file and you will find these 2 files:

• OneSignalSDKUpdaterWorker.js (Leave as it is)
• OneSignalSDKWorker.js (Leave as it is)

After you're ready, upload the files to the top-level root of your site directory and the following URLs should be publicly accessible:

• https://site.com/OneSignalSDKWorker.js
• https://site.com/OneSignalSDKUpdaterWorker.js

That's it. Now, try it on your site and you should be able to see the push notification when surfing through the EasyArticles.

Apple Safari Push Notification Integration

There are 2 fields that are crucial in configuring this application and those fields are being highlighted below.

• Site Name
  Your users will see this site name displayed on their notifications.
• Site URL
  This field is used to validate the identity of the site requesting push notifications using your ID. Only sites matching the field entered can use your OneSignal ID for push Notifications.
  Your site URL should not include anything after your domain extension and must contain the protocol (e.g. http:// or https://).
  Further information can be accessed through Safari support.

Configuring EasyArticles OneSignal Integration

Navigate to App Settings on OneSignal sidebar and click on Platforms tab. In here, you will find Apple Safari Web ID. Copy Web ID and paste it in EasyArticles OneSignalOneSignal Push Notification Integration which can be found at EasyArticles > Settings > Integrations > OneSignal Integrations.

Double check the pasted Safari App ID and make sure that it is correct.

That's it. Now, try it on your site and you should be able to see the push notification when surfing through the EasySocial.