Skip to content

In-app message editor blocks

Editor blocks are the various blocks available in the Drag-And-Drop Editor under the Build section. This section includes a series of tiles that represent the different kinds of content you can use in your message.

To use them, drag an editor block inside a column. It will auto-adjust to the column width. Each editor block has its own settings, such as granular control on padding. The right-side panel automatically switches to a property panel for the selected content element.


The following table describes how you can use each editor block type.

Name Description
Title Enters a title text into the message
Paragraph Enters a paragraph text into the message
Image Inserts an image from the media library
Button Adds a standard button. Properties for this block allow for editing, setting links, and logging analytics.
Spacer Adds space or padding between other blocks.
Custom Code (early access) Inserts raw HTML, CSS, and JS.


Details for each editor block’s properties are provided in the following tables.

Title and Paragraph

Name Description
Font Family This is the font style for your text
Font Weight Determines the thickness of your text
Font Size Determines the size of your text
Color Modifies the color of the text
Align Moves the text to be aligned left, center, right, or justified
Line Height Modifies the distance between lines of text
Letter spacing Modifies the distance in between each character


Name Description
Image Width Modifies the width of the image and the chosen unit of measurement
Align Moves the image to be left, center or right-oriented
URL The hosted address for your image
Alternate text The written copy that appears in place of an image if the image fails to load. Screen readers announce alt text to explain images, so use plain language to provide key information about an image


Name Description
Corner Radius Determines how round you would like the corners
On-click Behavior Determines the action when clicking the button and sets the appropriate link protocol
URL Dynamic based on the selected On-click behavior


Name Description
Background color Modifies the background color of the spacer
Height Modifies the height of the spacer. You can also modify this by using the resize handles on the spacer.

Custom Code

Name Description
Custom Code Allows you to add, edit, or delete HTML, CSS, and JavaScript for an in-app message.
New Stuff!