​
Design Template

You can design template with a simple form editor tool. You can add variables with Handlebars language. You can check how the message will look in the preview section on the right side. Once designed, you can save the push notification template by clicking on Save Draft.

When you are ready, you can Publish Draft by providing a name to the version. This will become the Live version, and will be used whenever the associated workflow is triggered.

​
Android Push notification fields description

FieldDescription
TitleSmall message text box. Note that this field will be displayed in single line only, and very long content can get curtailed. Use handlebars to add variables.
Small IconSmall icon is displayed on the top status bar as well as the notification itself. Developer needs to set this to your logo in your app. Default shown is bell icon. The color used is your brand color set in ‘Organisation Settings’
Large IconThe large icon will show up to the left of the notification text on Android 4.0.3 - 6.0 devices, and shows on the right for Android 7.0+ devices. SuprSend puts your organisation logo as default in the large icon, which you can set from ‘Organisations Tab’.
MessageLarge message text box. Use handlebars to add variables.
SubtextOptional Subtext appears on top, next to your brand name.
Banner ImageOptional For dynamic images: Banner filetypes: PNG, JPG, JPEG. Recommended aspect ratio: 2:1 Recommended maximum size: 700 KB For static images (that are uploaded): -SuprSend will auto-scale your image so that it doesn’t get cropped -SuprSend will optimise the image size so that it is loaded faster on low internet connections.
Action URLProvide a URL where a user will go when he clicks on the push notification. You can give your android deeplink URL as well.
Action ButtonsOptional Enter up to 3 Button names and URL. You can use variable names using handlebars in both action name and URL. You can give your android deeplink URL as well. The action button name color is picked up from your organisation settings. You cannot change button color in a template once it is created.

​
Android Push Advanced Configurations (Optional)

FieldTypeDescription
SilentBooleanWith Silent “ON”, users won’t see this message on their device. Instead, these notifications trigger background activities within the application using the notification payload. For instance, they could be utilized to send breaking news alerts or notify users that the latest episode of their favorite TV show is available for offline viewing. Silent notifications are particularly useful for delivering sporadic but time-sensitive content, where immediate access is crucial and the delay associated with background fetches may not be tolerable.
TimeoutNumericYou can use timeout if you want your notifications to auto-dismiss after a certain time period in case your user has not interacted with that notification. You can add time in seconds in this field.
Sticky NotificationsBooleanWith Sticky Notifications “ON”, the user will not be able to dismiss the notification by left swiping on the notification tray. However, notification will be removed from the tray if the user has clicked on the notification
Notification groupSingle line TextAdd a group name to the notification if you want your notifications to be stacked together in the tray. Notifications belonging to the same group will be stacked together.
App icon (Small icon)Single line TextSmall icon name without extension. The small icon is displayed on the top status bar and on the left side of notification header. By default SuprSend will show a bell icon, however you can customize this to show your app icon instead.
SoundSingle line TextSound file name without extension or with extension. This is used to play custom sound on notification delivery. If left blank, the default notification sound of the device will be played. To set custom sound, you’ll have to add raw sound file in your android app folder
Custom key-value pairkey-value pairYou can use this field to send custom key-value pairs to users’ device. This is generally used for storing and retrieving data for caching, app metadata, or user settings. You can combine it with silent notification if the purpose is to update data in user’s applications without notifying them. Both key and value is passed as string in the notification payload. e.g., if you are passing this json: {"foo":1, "bar:1}. It will be passed as "json": "{\"foo\":1,\"bar\":1}" in the payload. You can add variables in both key and value to programmatically pass custom data based on your event or workflow input. Please note that your app’s backend must be able to process custom key-value pairs for the data payload to function properly.

Required- Supported SDK version for app icon and sound:

  • App icon functionality is supported in Android native and react native version 0.1.8 and above.

  • Custom Sound is supported in Android native and react native version 2.2.0 and above.

If you are using an older SDK version, please upgrade to the latest SDK version

​
Adding dynamic content in Android Push

There will always be the case where you would be required to add dynamic content to a template, so as to personalise it for your users. To achieve this, you can add variables in the template, which will be replaced with the dynamic content at the time of sending push. To send actual values to replace variables at the time of communication trigger, use one of our frontend or backend SDKs. Here is a step by step guide on how to add dynamic content in android push:

1

Declaring Variables in the global 'Variables' button:

If you are at this stage, it is assumed that you have declared the variables along with sample values in the global Mock data button. To see how to declare variables before using them in designing templates, refer to this section in the Templates documentation.

2

Using variables in the templates:

Once the variables are declared, you can use them while designing the android push template. We support handlebars to add variables in the template. As a general rule, all the variables have to be entered within double curly brackets: {{variable_name}}

If you have declared the variables in the global ‘Variables’ button, then they will come as auto-suggestions when you type a curly bracket {. This will remove the chances of error like variable mismatch at the time of template rendering.

Note that you will be able to enter a variable name even when you have not declared it inside the ‘Variables’ button. To manually enter the variable name, follow the handlerbars guide here.

Below are some examples of how to enter variables in the template design. For illustration, we are using the same sample variable names that we declared in the ‘Templates’ section:

{
  "array": [
    {
      "product_name": "Aldo Sling Bag",
      "product_price": "3,950.00"
    },
    {
      "product_name": "Clarles & Keith Women Slipper, Biege, 38UK",
      "product_price": "2,549.00"
    },
    {
      "product_name": "RayBan Sunglasses",
      "product_price": "7,899.00"
    }
  ],
  "event": {
    "location": {
      "city": "Bangalore",
      "state": "KA"
    },
    "order_id": "11200123",
    "first_name": "Nikita"
  },
  "product_page": "https://www.suprsend.com"
}

  1. To enter a nested variable, enter in the format {{var1.var2.var3}}. Eg. to refer to city in the example above, you need to enter {{event.location.city}}

  2. To refer to an array element, enter in format {{var1.[_index_].var2}}. Eg. to refer to product_nameof the first element of the arrayarray, enter {{array.[0].product_name}}`

  3. If you have any space in the variable name, enclose it in square bracket {{event.[first name]}}

You will be able to see the sample values in the Preview section, as well as in the Live version when you publish a draft. If you cannot see your variable being rendered with the sample value, check one of the following:

  • Make sure you have entered the variable name and the sample value in the Variables button.

  • Make sure you have entered the correct variable name in the template, as per the handlebars guideline.

What happens if there is variable mismatch at the time of sending?

At the time of sending communication, if there is a variable present in the template whose value is not rendered due to mismatch or missing, SuprSend will simply discard the template and not send that particular notification to your user.

Please note that the rest of the templates will be sent. Eg. if there is an error in rendering Android Push template, but email template is successfully rendered, Android Push notification will not be triggered, but email notification will be triggered by SuprSend.

​
How to change the small icon for a notification?

To show a small app icon in your notification, you’ll have to add a small icon in the drawable folder of application modules. You can either use a vector drawable or a png image. We recommend naming this file as ic_suprsend_app_icon

Generate icon images with alpha transparency:

Note that Android only uses the alpha channel for the icon. It will display monochrome in the status bar but an accent color can be applied to the left side the notification itself.

​
How to add a custom sound file in your android project?

From Android O onwards, notification sound became a property of notification channel and is only set at the time of new category creation (Notification channel is identified as notification category in SuprSend). This means that for a user when you first time send the notification in a particular category, the sound is set for that category and even if you change the sound in your template, the sound in that category will not change. The updated sound will play for the user either if you send notification in a new category or user uninstalls and re-installs the app.

For devices on android version before O, the sound will be set at individual notification level and whenever you change the sound on a template, it will play the new sound for user. Leaving the sound field blank will play the default notification sound on the device.

To change the notification sound you will have to add the sound file to the raw folder of your android app.

projectroot/app/res/raw

Please keep the file name in lower case and avoid using space in the file name instead you can use underscore(_) in place of space

E.g.- notification.mp3, notificationMusic.mp3,notification_music.mp3

Sound is set at channel level for android version >= 8.0:

From Android O onwards (~95% of the android users), notification sound became a property of notification channel and is only set at the time of new category creation. So, the new sound set at template will only change for users if

  • you are sending the notification in a new notification category

  • user is installing the app for the first time or getting notification in that category for the first time

  • user has uninstalled and reinstalled the app

​
Image optimisations

SuprSend does some image optimisations in push notifications for images that are static in nature, ie. image is uploaded in ‘Banner Image’ field on template, so that the push notification delivery rate increases and the time of delivery for push notification reduces. These optimisations are as below:

1. Image optimisation based on Screen Width

If there is a very large image in the “Banner Image” field, SuprSend will reduce the image size to fit as per the mobile screen width of your user.

2. Image optimisation based on network

Your users might be on different network, namely wifi, 4G, 3G, 2G. And therefore, depending on your user’s network we optimise the image size.

This improves the push notification delivery for users whose network is not very fast.