This article provides you with information for setting up Web Push notifications to user groups across multiple browsers.
See our onboarding video about Web Push campaign creation:
1. Web Push tab
To check the existing Web Push Messages, go to Channels->Web Push tab. On this tab you can see details of all your web push messages listed with their Name, Recipient source, Status, Domain name, number of messages Sent, the date it was Created and last Changed.
Clicking the delete is a hard delete action. It means that the delete action is irreversible and will delete the Push message permanently.
1.1. Recipient Source
A Push message can have one of the following Recipient sources:
- Automation - Sends push messages from an Automation Center or Interactions program.
- Using a segment - Sends push messages to a standard Emarsys segment.
- Using a contact list - Sends push messages to a contact list.
1.2. Status
A Push message can have one of the following statuses:
- In design – Some content or settings are still missing.
- Tested - Test message has been sent but not launched yet.
- Ready to launch – Not activated yet, but ready to launch.
- Launched - Campaign has been launched
- Canceled - The already launched Web Push campaign has been called off.
2. Creating a new push message
Click Create Web Push Message in the Web Push tab to open the message creation wizard. Emarsys offers a very intuitive workflow for creating new push messages. These are presented in the form of the following main steps:
Scheduling step is only available if the recipient source is using a segment.
2.1. Message settings
Define the General settings of your brand new push message campaign (or rename your existing one).
General settings
- Message name – You can name (or later rename) your push message to identify the campaign on the Push Messages tab.
- Domain name – You can select the domain on which you want to display your message notification. You can send your message only to one domain. Only domains already associated with your account are listed here.
-
Recipient source – Define the target audience of your message. For options, see Recipient source.
- Segment – You can select a pre-built segment, if you are using a segment for your recipient source.
2.2. Recipient source
The options for Recipient source are as follows:
- Automation – Sends push messages from an Automation Center or Interactions program.
Web Push Message can only be used in an Automation Center or Interactions Program if the Recipient Source is set to Automation and the Push Message is launched. After the Push Message is launched, it can be selected in the drop-down menu of the Mobile Engage Push message node in the Automation program. If the Push Message is not yet launched, then it will not show up in the drop-down.
- Using a segment – Sends push messages to a standard Emarsys segment.
- Using a contact list - Sends push messages to a contact list.
3. Content creation
In the Content creation step you have several tabs to use for defining the content of your push message campaign and also the Preview pane to add text/media. The tabs in the Content Editor are the following:
3.1. Adding text and rich media
The character limit for Web Push campaigns varies depending on the device, the operating system and the browser used.
- Message title: For the title of the message, the character count can vary from 30 to 69 characters.
- Message body: For the body of the message, the character count can vary from 65 to 200 characters.
The lower ends of the character limit ranges are due to the device being a mobile device. If the campaign is more aimed at desktop users, it is suggested to use no more than 40 characters for the title and 88 characters for the body to stay within the limits of nearly all desktop web browsers.
To add text to the push message, type the text directly into the Preview pane available on the right hand side of the screen.
There are 2 types of images that can be added to a campaign, icon image and banner image.
Icon image
- Click on the Media Icon at the right of the push message.
- Click on the plus icon to the right of the image you wish to add to the push message.
- Click Apply.
The recommended size of the icon image is 192 pixels by 192 pixels.
Safari does not support changing the icon.
Banner image
Banner image support requires the Web SDK and Service Worker to be on version 2.5.0 or above.
Not all operating systems and browsers support banner images. Current operating systems and browsers that do support banner images are Chrome on Windows and Android (Chrome removed support for banner images on MacOS as of version 59). For operating systems and browsers that do not support this feature, the banner image will not be displayed to the user.
- Click on the Media Icon below the body of the push message.
- Click on the plus icon to the right of the image you wish to add to the push message.
- Click Apply.
The image width should be a minimum of 300 pixels and a maximum of 2000 pixels. The recommended ratio is 2:1, for example 1440 pixels by 720 pixels.
3.2. Personalization tab
Use the Visual Content Editor (VCE) to add new content (personalized token) to the push message field.
You can add a personalized token to your push message, as follows:
- Use the dynamic search field to find the required personalized token.
- Alternatively, you can select a token from the following categories:
- Capabilities: Contact data (General, Personal, Company, Other)
- Use Cases: External, First Name, Voucher
- Alternatively, you can select a token from the following categories:
- Drag the selected token over onto the Preview pane and drop it to the field where you want.
3.3. Action Buttons
Action button support requires the Web SDK and Service Worker to be on version 2.5.0 or above.
Use the Action Buttons tab to add a destination URL for when the contact clicks on the push message.
There are 2 options when setting the destination URL:
- Add Default Action - The destination URL if the user clicks anywhere on the web push campaign message.
- Add Button - It is possible to add up to 2 action buttons to provide the user a choice of action.
Only Chrome browsers currently support action buttons. It is therefore strongly recommended to set a default action for users that do not use Chrome.
You can also use custom events to trigger Automation programs. For more information, see Custom events.
When adding a Default Action or Action Button, there are 2 link type options:
- External URL - Choose this if the link is a standard link to the website.
- Deep link - If the link is to deep link into a section of an Android mobile app, choose this option. Please note, the Android app should be preconfigured to know how to handle the link.
Once the action type is selected, enter the URL and click Apply.
Edit the label of the button directly on the campaign preview screen.
3.4. Languages tab
You can add and remove languages. Use the dynamic search field to find the requested language or select it from the drop-down list then click Add.
Add any new languages and write the message content in that language. Languages which are not shown here will receive the content in the browser default language.
You can delete languages as well, but a default language is mandatory.
If you add a language but it has no content, those customers will also receive content in the browsers default language.
3.5. Custom Data tab
You can use custom data fields to attach metadata to web push messages and act on this data after a message is delivered.
These fields come in handy in the case of triggered web push messages: you can use custom data fields to add data to the API call and customize the push message with it.
To create custom data fields, navigate to Web Push > Domains and click the Custom Data Fields icon, then click Create Custom Data Fields.
Please note that the same guidelines apply to Web Push and Mobile Engage custom data fields. For more information, see Custom data fields.
All the custom data fields are listed on the Custom Data Fields page. Here you can also edit or delete custom fields.
3.6. Web Push Settings tab
Here you can define the interval after which your messages expire in seconds.
Previously, the default Expiration Time values of the Web Push Time to Live (TTL) property were defined by the providers. Default values might differ depending on the protocol used by the providers and they cannot exceed the following limits:
- VAPID: 4 weeks (28 days)
- APNS: 30 days
For more information on the Web Push Settings, watch the June 2024 Product Release video:
3.7. Testing a push message
Click Test Messages button on the left.
In the appearing Send Test Message window, you can specify an email address or contact list to which a test message will be sent.
The test email address must be a valid address in your Emarsys database, associated with a known device.
For sending the test message to a contact list or segment, the maximum number of contacts allowed in the contact list is 50. This is to mitigate the risk of sending to a large audience by accident.
Before clicking Save & Send check if the following requirements are fulfilled:
1. You need to test it with a contact already present in the Emarsys database.
2. Log in to the browser.
If you are not logged in, the following error message is displayed:
Unable to send test message to any contacts because they have no assigned devices. Please log in to all the devices on your contact list and try again.
3. Enable the notifications for your browser (please note that we tested this procedure in Google Chrome).
4. You need to go to your website and register the contact.
5. Enable the notifications for your website.
6. If you are using Windows, turn off Focus assist.
The contact should have a valid value for the field used for identification. You need to check how this field is updated upon registration. If you need further assistance, please contact your Implementation Consultant. You can check if the contact has a valid value for this field by searching for the contact and clicking the Other tab.
If sending of the test message fails, a red warning message appears on the screen. The reasons for this could be the following:
- No contact has been found in Emarsys database with the given email address.
- The email address has been found, but there is no device associated to it.
To test your message, click Save & Send.
Click Next step to continue to the Scheduling step.
Scheduling step is only available if the recipient source is using a segment.
4. Scheduling
When you have tested your message, and the recipient source is using a segment you can continue to the Scheduling step.
On this screen, the number of users in the applied segment are displayed.
In the Scheduling section, you can either select Launch now for immediate action, or you can define a specific date and time in the future and click Schedule. Scheduling launches in the future is available to all kinds of recipient sources except the Automation.
When a message is scheduled for launch, the contents of the message are still editable right up until launch and can even be deleted. If the message content is deleted for any additional language, the default language will be used; if that is empty no message will be sent.
4.1. Setting up push throttling
You can throttle your mobile- and web push campaigns when sending to large portions of your contact base, to ensure that your backend systems are not overwhelmed by spikes in demand.
1. Tick the Set Up Campaign Sending Rate check-box at Push Throttling.
2. Select a preset push message sending rate.
3. Check the following calculated information on push message sending:
1. The calculated push message sending speed.
2. The estimated time it will take this campaign to fully send out with the given speed.
3. The estimation of the earliest time when the last message is going to be sent. It can be later than the estimation, but not earlier.
4.2. Canceling the campaign launch
The Web Push Cancel Campaign Launch feature has been rolled out. In that case, you do not see it in your account, contact your Client Success Manager.
Optionally, you can click the Cancel button to call off an already launched campaign.
Before canceling a campaign a warning message notifies you that canceling a launched campaign is irreversible and the campaign cannot be re-launched at all, later on.
A canceled campaign cannot be edited. First, you have to copy the campaign and make modifications on the copied version of it.