Style JSON for Rich Messages

The style JSON determines how the different elements of a received rich message are rendered in the app.

{
	"elements": [{
			"key": "title",
			"type": "string",
			"font": "Lato-Regular",
			"text_color": "#ffffff",
			"font_size": 27,
			"bold": false,
			"italic": false,
			"underline": false
		},
		{
			"key": "subtitle",
			"type": "string",
			"font": "PlayfairDisplay-Bold",
			"text_color": "#FFC800",
			"font_size": 16,
			"bold": false,
			"italic": false,
			"underline": false
		},
		{
			"key": "body",
			"type": "string",
			"font": "Lato-Regular",
			"text_color": "#ffffff",
			"font_size": 14,
			"bold": false,
			"italic": false,
			"underline": false
		},

		{
			"key": "cta",
			"type": "primary",
			"border_color": null,
			"border_width": 0,
			"corner_radius": 5,
			"background_color": "#ffffff",
			"font": "Lato-Bold",
			"button_size": "regular",
			"text_color": "#000000",
			"font_weight": "bold",
			"font_size": 14
		},
		{
			"key": "cta",
			"type": "secondary",
			"font": "Lato-Bold",
			"button_size": "regular",
			"text_color": "#ffffff",
			"font_size": 12
		},
		{
			"key": "hero_content",
			"type": "image"
		},
		{
			"key": "hero_content",
			"type": "video"
		}
	],
	"layout": {
		"background": {
			"type": "color",
			"url": null,
			"color": "#2380B4"
		},
		"font": null,
		"text_color": null
	}
}

Elements Object

The elements object contains different keys and their properties, such as title, subtitle, body, etc.

Key - title

A suitable title for the rich message. A well-crafted title increases the chances of a user reading the content of a message.

Name	Type	Description
`type`	String	This is the type of the element received in the JSON. The type of the element title is string as it is text that will be used as the title of the rich message.
`font`	String	Font style applied to the title text
`text_color`	String	Color of the title text
`font_weight`	String	Weight of the title text
`font_size`	Integer	Size of the font used for the title text
`bold`	Boolean	Determines if the title should be rendered in bold
`italic`	Boolean	Determines if the title should be rendered in italics
`underline`	Boolean	Determines if the title should be underlined

Key - subtitle

A subordinate title that provides additional information about the content

Name	Type	Description
`type`	String	This is the type of the element received in the JSON. The type of the element subtitle is string as it is text that will be used as the subtitle of the rich message.
`font`	String	Font style applied to the subtitle text
`text_color`	String	Color of the subtitle text
`font_weight`	String	Weight of the subtitle text
`font_size`	Integer	Size of the font used for the subtitle text
`bold`	Boolean	Determines if the subtitle should be rendered in bold
`italic`	Boolean	Determines if the subtitle should be rendered in italics
`underline`	Boolean	Determines if the subtitle should be underlined

Key - body

The body text content of a rich message

Name	Type	Description
`type`	String	This is the type of the element received in the JSON. The type of the element body is string as it is text that will be used as the body of the rich message.
`font`	String	Font style applied to the body text
`text_color`	String	Color of the body text
`font_weight`	String	Weight of the body text
`font_size`	Integer	Size of the font used for the body text
`bold`	Boolean	Determines if the body should be rendered in bold
`italic`	Boolean	Determines if the body should be rendered in italics
`underline`	Boolean	Determines if the body should be underlined

Key - cta

Short for "call to action", CTA is a device designed to prompt an immediate response from a user.

Name	Type	Description
`type`	String	Type of CTA: "primary" or "secondary"
`border_color`	String	Color of the CTA button border
`border_width`	Integer	Width of the CTA button border
`corner_radius`	Integer	Radius of the corners of the CTA button. This determines how rounded the corners are.
`background_color`	String	Background color of the CTA button
`font`	String	Font style of the CTA button label
`button_size`	String	Size of the CTA button
`text_color`	String	Color of the CTA button label text

Key - hero_content

The first visual content that a user encounters when viewing a rich message

Name	Type	Description
`type`	String	Tells the mobile client if the hero content is an "image" or a "video"

Layout Object

Name	Type	Description
`background`	Object	Contains information about the background content of the message: `type`: The background can be either an "image" or a "color" `url`: The url of the image used as the background `color`: The code value of the color used as the background
`font`	String	Default font style that will be rendered if the app does not find the font style specified in any particular element
`text_color`	String	Default color of the text that will be rendered if the app does not find the text color specified in any particular element

Generating x-pch-digest Header for Mobile APIs

Maintain Unique Device ID for Mobile Devices