Blueshift provides interactive and easy to use template editors. You can use these editors to create and send beautiful push notifications. However, the templates and capabilities may vary depending on whether you have installed our SDK or not. Based on the tools that are available, you can use these templates to send push messages to your customers to drive engagement on your mobile app.
The template editor
Before you get started, it's important that you get used to the editor's interface and the tools it provides. We suggest that you take a look at the following images and associated pointers that indicate how to use the editor.
(Click to see the full-size image)
Let's review the editor's components one-by-one.
Template configuration tabs
When you launch the template editor, either to create a template or edit an existing one, the first page that you see is the Properties tab of the template editor. Each tab provides options to configure the template. Here are the tabs that are available:
- Properties: Provides options to specify and review a template's basic properties. Such as:
- The template's name
- Its organization using tags and tag folders
- The push notification type of the template
- Campaign behavior properties
- Preview panel
- Content: Provides options to design your template.
- Data: Provides options to use the recommendations in the template and review its data.
- Test Send: Provides options to push a test notification to a device.
Following sections provide more information on each tab.
Properties
This is normally the first page that you see when you open or create a template.
This page provides options to edit the name, organize it under tags/tag folders and more. You can also change the customer to preview how the template looks like for someone else.
You can click on the edit button next to the notification type to choose a new one in the Notifications section.
In addition, you can set the campaign behavior properties such as:
- You can stop Blueshift from sending messages if one of the recommendations that you add in the template are empty
- You can stop Blueshift from sending messages if one of the external fetches (such as images) that you add in the template are empty
- You can stop Blueshift from sending messages if there is an unavailable product in the event that triggers the message
The properties page also lists:
- The type of the push notification (covered in detail under the Content tab)
- The campaigns that use the template
Content
This is the tab where you design the template and specify its content. You can create a push notification for iOS as well Android devices.
If you use our Android and iOS SDKs, you can choose templates using the iOS/Android Notification Type drop downs. Here's the list of templates that you can choose:
|
iOS |
Android |
|
None |
None |
|
Plain Text |
Plain Text |
|
Custom JSON |
Custom JSON |
|
Title + Content |
Title + Content |
|
Rich Push With Image |
Rich Push With Image |
|
Rich Push With One Action Button |
Rich Push With Image & One Action Button |
|
Rich Push With Two Action Buttons |
Rich Push With Image & Two Action Buttons |
|
Silent Push |
Silent Push |
|
Dialog Box With One Button |
Dialog Box With One Button |
|
Dialog Box With Two Buttons |
Dialog Box With Two Buttons |
|
Animated Carousel |
Animated Carousel |
|
Non Animated Carousel |
Non Animated Carousel |
While our SDK has its benefits, we recognize that you may not be able to install it yet. You can still send plain text notifications or paste/add json payload to create rich notifications. You can also copy templates between Android and iOS.
Data
This is the place where you specify the data that you want to use in your template to customize it for your customers.
To preview the push notification that is customized for a customer, ensure that you select the customer at the top right.
Here are the details that you can provide and use in the template's content:
- Recommendation: Choose the recommendation algorithm that'll automatically choose products that you want promote in a push message.
- Event payload: Choose an event that triggers a push notification. You can either provide a custom JSON payload of the event or choose one of existing ones. When you specify an event payload, you can preview the data that comes back to us when one of your customers interact with the push notification that we send.
- External fetch (if you want to include data from an external source): Choose an external source to include dynamic messages in your push notification. You can include one or more external fetch creatives, each of which calls a unique API endpoint. You can then use the content that your API endpoint(s) return in your in-app messages using Liquid. For more information, see this doc.
Test Send
To preview your personalized content, you can push a test notification to multiple users from within the Template Editor. Statistics on test send (open, click, etc.) will not be tracked.
Image Size
In Blueshift Mobile SDKs, we use images in both push and in-app messages on various templates. The SDK is responsible for downloading and displaying the image. To make this a good experience for your customer, we recommend that you use optimized images. The rule of thumb is to keep the image size as low as possible without compromising the clarity. Anything less than 100 KBs is highly recommended.
You can take a look at the following recommendations that could improve the user experience when image based templates are displayed using Blueshift's mobile SDKs.
Rich push with image/carousel
The rich push & carousel images use the same kind of images.
|
OS |
Push Notification type |
Aspect Ratio(W:H) |
Recommended resolution |
Recommended size |
Max size |
Image formats |
|
Android |
Image Push notification |
2:1 |
512x256, |
Less than 512KB |
5MB |
PNG, JPG |
|
Android |
Carousel Push notification |
2:1 |
512x256, 1024x512 |
Less than 512KB |
5MB |
PNG, JPG |
|
iOS |
Image Push notification |
1:1, 2:1 |
512x512, 1024x512 |
Less than 512KB |
10MB |
PNG, JPG, GIF |
|
iOS |
Carousel Push notification |
1:1, 2:1 |
512x512, 1024x512 |
Less than 512KB |
10MB |
PNG, JPG |
For iOS carousel push notifications, ensure that you use the same aspect ratio & same resolution images. An image of a different aspect ratio gets cropped before it's displayed to your customers.
Android
Rich push notification Carousel push notification
iOS Rich push notification with 1:1 aspect ratio image
Lock screen Expanded notification
Rich push notification with 2:1 aspect ratio image
Lock screen Expanded notification
Carousel push notification with 2:1 images
Lock screen Expanded notification