Push Notifications - Custom Code Payloads

Push Notifications - Custom Code Payloads


We've covered how to get started with Customer.io Push, but if you want to customize your push notifications even further and add things like deep links or images, custom payloads are the answer!

Getting started with custom payloads

Creating a custom payload for your push notification gives you granular control over the notiification and its behaviour and appearance, in the same way as coding your email(s) in HTML does. It's a bit more complex, but you can use it to add images, deep links, or interactions.

To access the custom payload editor, use this toggle:

image.png

You can then write or paste your custom code into the editor. Note there are different tabs for Android and iOS so that you can send custom code for each platform separately but, if you are using Firebase Cloud Messaging, you can just use the Android tab to send custom code that will be used for both Android and iOS.

Guidelines

First and foremost, identify what you'll be doing with your custom payload: creating a deep link? Showing an image? Next, make sure that your app supports that functionality.

  • If it does, your engineering team should be able to provide the JSON code for you.
  • If it doesn't, reach out to your engineering team and ask what your payload should be.

Since all apps are unique, there are many ways your custom code could be structured. Your app developer is likely the best resource for determining what payload to send.

Once you have your payload, you'll need to ensure that:

  1. Your JSON code is valid
  2. The code you use follows the guidelines for the specific provider:

Basic Example: Android (and iOS via FCM)

Here's the most basic example of a custom payload for sending to Android and iOS devices via Firebase Cloud Messaging:

{
  "message": {
      "notification": {
        "body": "YOUR MESSAGE BODY HERE",
        "title": "YOUR MESSAGE TITLE HERE"
      }
  }
}
Sending iOS-specific fields via FCM
If you need to provide iOS-specific fields when sending push notifications via Firebase Cloud Messaging you will need to format the data according to the FCM documentation.

Basic Example: iOS (when sending via APNS)

And here's the most basic example of a custom payload for sending to iOS devices via Apple Push Notification Service:

{
  "aps": {
    "alert": {
      "body": "YOUR MESSAGE BODY HERE",
      "title": "YOUR MESSAGE TITLE HERE"
    }
  }
}

Using Customer Data

As always, you can use customer or event data in your custom payload code. Here's what a basic Android (and iOS via FCM) example might look like using customer and event data:

{
  "message": {
      "notification": {
         "body": "Hi {{customer.first_name}}, your {{event.event_title}} has been booked!",
         "title": "All set!"
      }
  }
}

And the same in iOS (when sending via APNS):

{
    "aps": {
        "alert": {
          "body": "Hi {{customer.first_name}}, your {{event.event_title}} has been booked!",
          "title": "All set!"
        }  
    }
}

This would result in a push notification that looks like this (on iOS):

Got feedback?

We're hoping to get your feedback on how you're using custom payloads, if there's anything you're struggling with, or if there's anything you're really enjoying about it and want to make sure we keep.

Let us know!

Was this article helpful?