Customizing an In-App message customizing-an-in-app-message
To fine-tune your In-App message, Adobe Campaign allows you to access a set of advanced options while designing an In-App.
The In-App content editor lets you choose between two In-App message modes:
- Message Template: this template allows you to fully customize your In-App with images or videos and action buttons.
- Custom Message: this template lets you import custom HTML.
Related topics:
Customizing with a message template customizing-with-a-message-template
Layout layout
The Layout drop-down provides you with four different options to choose from depending on your messaging needs:
-
Full page: This type of layout covers the entire screen of your audience devices.
It supports media (image, video), text and button components.
-
Large modal: This layout appears in a large alert-style window, your application is still visible in the background.
It supports media (image, video), text and button components.
-
Small modal: This layout appears as a small alert type window, your application is still visible in the background.
It supports media (image, video), text and button components.
-
Alert: This type of layout appears as a native OS alert message.
It can only support text and button components.
-
Local notification: This type of layout appears as a banner message.
It can only support sound, text and destination. For more on local notification, refer to Customizing a local notification message type.
Each type of layouts can be previewed on different devices such as phone, tablet, platform e.g. Android or iOS and orientation e.g. landscape or portrait in the right-window of the content editor.
Media media
The Media drop-down allows you to add media to your In-App message to create a compelling experience for end user.
-
Select your Media Type between image and video.
-
For the Image media type, enter your URL in the Media URL field based on the supported formats.
If needed, you can also enter the path to a Bundled image which can be used if the device is offline.
-
For the Video media type, enter your URL in the Media URL field.
Then, enter your Video poster to be used while the video is downloading on the audience devices or until users tap the play button.
Text text
If needed, you can also add a message title and content to your In-App message. To better personalize your In-App message, you can add different personalization fields, content blocks and dynamic text to your content.
-
In the Text drop-down, add a title in the Message title field.
-
Add your content in the Message content field.
-
To further personalize your text, click the icon to add personalization fields.
-
Type in your message content and add your personalization fields if needed.
For more information on personalization field, refer to this section.
-
Check your message content in the preview window.
Buttons buttons
You can add up to two buttons to your In-App message.
-
In the Buttons drop-down, enter the text of your first button in the Primary category.
-
Choose which of the two actions Dismiss and Redirect will be assigned to your primary button.
-
In the Secondary category, add a second button to your In-App if needed by entering your text.
-
Select the action associated to your second button.
-
If you chose the Redirect action, enter your web URL or deeplink in the Destination URL field.
-
Enter your web URL or deeplink in the Destination URL field, if you chose the Redirect action,
-
Check your message content in the preview window or by clicking the Preview button.
Refer to the Previewing the In-App message page.
Settings settings
-
In the Settings category, select your background color between light and dark.
-
Choose to display or not a close button with the Show close button option to provide users a way to dismiss the In-App message.
-
Select if your button alignment will be horizontal or vertical with the Button alignment option.
-
Choose if your In-App message can be auto-dismissed or not after a few seconds.
Customizing a local notification message type customizing-a-local-notification-message-type
Local notifications can only be triggered by an app on a particular time and depending on an event. They will alert users that something is happening in their app even without having access to the Internet.
To learn how to track local notification, refer to this page.
To customize a local notification:
-
From your Content page, select Local notification in the Layout category
-
Under the Text category, type down your Message title and Message content.
-
Under the Advanced option category, in the Wait to display field, choose how long in seconds your local notification will be displayed on screen once your event is triggered.
-
In the Sound field, enter the filename of the sound file, with the extension, to be played by the mobile device when the local notification is received.
The sound file plays when delivering the notification if the file is defined in the mobile application’s package. Otherwise, the device’s default sound is played.
-
Specify a destination to redirect your users when they interact with your local notification in the Deeplink URL field.
-
To pass custom data in the payload in the form of a key value pair, you can add custom fields to your local notification. In the Custom fields category, click the Create an element button.
-
Enter your Keys then the Values associated with each key.
Please note that the handling and purpose of custom fields is entirely up to the mobile app.
-
In the Apple options category, fill in the Category fields to add a category ID for custom actions if available in your Apple mobile application.
Customizing with a custom HTML message customizing-with-a-custom-html-message
The Custom message mode allows you to directly import one of your pre-configured HTML message.
To do so, you just have to drag and drop or select your file from computer.
Your file must have a specific layout which can be found by clicking the Download the sample file option.
You can also find a list of custom HTML requirements for a successful import in Adobe Campaign.
Once your HTML has been imported, you can find a preview of your file on different devices in the preview window.