Getting started

1.1 Prerequisites

The Accengage Web SDK provides a JavaScript module that will enable your website to use the Accengage Push Notification software very easily.

The current Web SDK version is  3.4.x  and currently works with  Chrome 42+ Firefox 44 (Windows/Apple desktop and Android devices) , and Safari 11.1 (and higher) for Mac.

In order to integrate the Web SDK, it is recommended to have some knowledge in HTML ,   CSS and JavaScript

For the basic integration and customization, it is possible to proceed without a deep knowledge, especially if you are used to Tag Management Systems. For the advanced customization and tagging, it is however recommended to have a good knowledge of these.

1.2 Compatibility Matrix

The current version of the Accengage Web SDK supports the following browsers:

  • Chrome 42+  on PC, MAC and Android phones
  • Firefox 44+ on PC and MAC and Android phones
  • Safari 11.1+ for Mac

Accengage complies with the Push API W3C standard, which means that any browser which complies with this standard, will be compatible with our Web Push SDK. This includes:

  • Chrome
  • Firefox 
     

Safari on Mac also supports Web Push Notifications, but uses another protocol, very similar to how iOS supports Push Notifications.

Note that Safari on iOS does not support Web Push Notifications, and neither do any other browser. 

Browser version Compatible
Chrome 44+ (tick)
Firefox 46+ (tick)
Safari 11.1+ (tick)

Opera

/ (error)
Below is the rendering of Web Push Notifications following the format of the message: 
Message Images
Simple

Button & Images

(can be seperated)

The Accengage SDK is compatible with Progressive Web Apps ‘PWA’ (on Android Chrome Browser), and is not compatible with Accelerated Mobile Pages ‘AMP’ (on mobile devices).


1.3 Setup

1.3.1 Google Chrome Setup

In order to activate Web Push Notifications for your website, you will need to create and obtain a Google API Key, and an Android Sender Id.

These credentials will enable Accengage to be the authorized sender for your Web Push Notifications.

They are associated to your GCM (Google Cloud Messaging) or FCM (Firebase Cloud Messaging) project. If you do not have a FCM or GCM project already, you will first need to create a project on Firebase by following this link : FCM console.

Once your project is created, go to "Settings > Cloud Messaging", and retrieve your Server Key which will be used as your Google API Key, and your Sender ID which will be used as your Android Sender ID.


1.3.2 Safari setup

In order to send push notification to Safari users, you will need to generate and obtain a Push Certificate, and a Website Push ID from Apple developer website.

In the Apple Developer website, go to the " Certificates, IDs & Profiles" secton.

Then go to  "Identifiers > Website Push IDs".



Then click on the  "+" icon to create a new "website push id".

You shall be redirected to this section :

Click on  "Continue" and save your new website push id.

Next, click on  "Certificates > Production" (or Certificates > Development - for a testing environment)

Select  "website Push ID Certificate" .

Click on "Continue".

In the next page, select the website push id previously created.

Then click on  "Continue" . Follow the next steps provided by Apple to generate your certificate.

At the end, you should be provided a  ".p12" file.

Save this file as you will need to upload it in Accengage configuration interface (See 1.4)

1.3.3 Firefox setup

To send Web Push Notifications on Firefox, there is no credentials needed

1.4 Configure the Accengage dashboard

Once you have subscribed to Accengage services, our support team will provide you with a Partner Id and a Private Key for each website and each environment

  • Development
  • Production

As well a ‘MASTER DOMAIN’. These are only available for registered customers on our platform. If you do not have a partner id, private key and MASTER DOMAIN yet, please contact our support at http://ticket.accengage.com

Within the Accengage Dashboard, you will see the created applications in Settings > Manage your applications. You will now have to provide some basic information to finish the application configuration:

Our support team will create your Web Application. To do so, we will ask you to provide some basic informations:

Registered Domains

Domain names with which you want to use our Web SDK. For example if you have different top-level-domains ".com" and ".fr", you must register them as two distinct domains. The same logic applies if you have an optional "www." subdirectory.

Google API Key

Refer to the part “Activate Web Push Notifications” Create a FCM project to obtain these credentials.

Android Sender ID

Default URL on Notification Click

A default URL (generally your website's home page) used to open a new window when the user clicks on your notifications. Obviously, you will be able to use a more specific URL while creating a message.

Default Notification Image

A default image displayed on your notifications. Same as above, you can use a specific image when editing messages.

Certificate

When creating a certificate on the Apple Developer website, a ".p12" file has been generated. We must need this file to configure your application in the Accengage Dashboard.

Website push id

When creating a certificate on the Apple Developer website, it has been asked to you to register a Website Push ID. We must need it to configure properly your application in the Accengage Dashboard

That’s it! You’ve now finished the initial configuration for your web application. Let’s now look at how to integrate the Accengage Web SDK into your website

When you play the video, click on HD to enhance video quality