Este artigo está atualmente disponível em inglês e espanhol. Você pode usar esta documentação enquanto ela não estiver disponível em seu idioma.
The web push notification editor allows you to visually design the content of the web push notifications that will be sent to your customers from your account, via workflows created for this purpose.
How to access it
You can access the web push notification editor through two paths:
1. From “Content > Push Notifications”. Click Create new push notification to generate a new push, or click More and select Edit to modify an existing notification.
2. From the "Show push notification" node of a workflow, by clicking (Edit node settings). Click Create new content or Edit to modify an existing notification.
Interface
The web push notification editoris made up of 3 blocks:
1. Preview and save: to save or discard the changes made and preview the final result of the content that will be displayed by the browser.
2. Design panel: to build the push notification using the visual editor.
3. Toolbox: to configure all the properties of the notification and add the content. This panel can be collapsed or expanded by clicking I (Open toolbox) or (Close toolbox).
How it works
The web push notification editor is based on a visual builder that allows you to create notifications quickly and easily, showing changes in real time.
1. Edit general options
In the Toolbox (3) panel, click on the General tab to edit the overall look.
The parameters to define are:
-
Content name: the name you want to give the content to identify it in your Connectif account.
-
Advanced properties:
- Add a vibration pattern: a particular vibration rhythm that you can add to this notification.
-
Requires contact interaction: to configure if the contact must interact with the device to stop the vibration.
-
Is a silent notification: to set the notification to make no sound.
2. Add content to the web push notification
In the Toolbox panel (3), click on the I Content tab to add the content of your notification, this will show the changes in real time in the design panel (2).
It’s composed of these elements:
- Push notification title : text that will appear at the top of the message.
- Push notification message: the main body of the notification text.
- Add a URL to redirect: link to the indicated page. It must be an absolute link.
If the "Close on click" box is checked, the notification will be closed when the contact clicks on it.
-
Image URLs:
- Icon URL: this is the image that appears in the upper left corner, as an icon.
- Image URL: this is the featured image. It is shown in the template occupying the lower half of the notification.
- URL of the notification tray icon: this is the image that will appear in the notification tray of the device on which you receive the push.
3. Add a compact version
In the Toolbox panel (3), click the Compact Version tab to add a reduced version to your notification content.
The compact version is the reduced web push notification, where the featured image is not displayed.
It’s composed of these elements:
- Compact message : the main body of the notification text that will appear in the popup window.
- URL of the compact icon: add the image that will appear in the upper left corner as an icon.
4. Add variables to the push notification
The two versions of push notification allow you to customize them by adding variables in any of the push elements.
Click I {} (Define a dynamic variable) in the place where you want to include the variable.
Assign a name to the variable to distinguish it and a default value to define the value you want it to acquire when there is no data stored in the corresponding field.
5. Add extra actions
Add up to two links with alternative actions to the main one in your push notification. To do this, in the Toolbox panel (3), go to the Actions tab and click Add action.
You can add a title, URL and icon to your action, as well as activate the option to close the push when the contact clicks on the action.
6. Preview final result and save
You can see the final result of your web content in the preview and save panel (1). To do this, click Preview and/or Compact preview to review the result in a compact version.
Once you’ve got the right design, click I Save to save your changes to your web content.
Congratulations!
You’ve reached the end of the tutorial.
Do you have questions?
Don’t forget, our Connectif specialists are here to help you. To contact them, just open a Support ticket by clicking the blue “Help” button on your dashboard.
Keep learning!
To make the most of your Connectif account, we recommend reading these articles next:
- Configure web push notifications, to configure this communication channel and be able to send push notifications.
- Push subscription with browser notification, to trigger the browser web push subscription notification without sending web content.
-
Bulk web push notification campaign, to create a bulk push campaign.
- Abandoned cart recovery funnel, to activate a cart recovery strategy through push notifications.