In-app messages are shown in the mobile app as a layer over the content (overlay) or as view component injected (added as a subview) into the app (inline).

The guides in this section cover the implementation on the application side. To learn more about in-app messages, their types, and creating the content, see the User Guide.

WARNING: Due to operating system differences and web engines, in-app message appearance may differ between systems or not be as expected. You should test your in-app messages.

Requirements

Recommended Mobile SDK version:
- Android - 5.3.0 or newer
- iOS - 4.12.0 or newer
- React Native - 0.12.0 or newer
- Flutter - 0.5.0 or newer
If your in-app content (such as JavaScript, CSS, images, or fonts) is being loaded from your own server via HTTP and you have configured CORS policies, you need to set the contentBaseUrl to your server's address. For example, if you're loading resources from https://www.synerise.com/example/font.woff, you should configure contentBaseUrl to https://www.synerise.com (check this option in the Settings).
Enable the IN_APP_DEFINITIONS_COMMUNICATION_READ (Experience Hub) permission in the Profile (formerly Client) API key used by the mobile application so the mobile application can fetch in-app messages.
The API key permission matrix with the in-app permission
Inline in-apps with automatic or on-demand trigger: create an InlineInAppView using the SDK and embed it in your app's UI. The placement key used in the SDK must match the one configured in the campaign.

Good practices

Campaign planning recommendations

Using a large number of in-app messages in your application can impact rendering time, message delivery, and battery usage.

To maintain optimal application performance when using in-app campaigns:

Avoid assigning more than 10 in-app messages to the same trigger event.
Avoid having more than 20 in-app messages active at the same time in your application.
Review and archive in-app campaigns that you no longer need.

Template construction

When creating or editing in-app message content:

Place the the SRInApp.close() (or SRInApp.hide()) method at the beginning of the JS script.
Use try/catch to handle possible fatal errors in the JS script.
Handle situations where Jinjava inserts return empty data.
When adding external links to your message:
- Only link to sites you trust.
- Don't link to large images that may negatively affect performance.
- Don't link to resources whose CSS/HTML may be blocked. If you have resources loaded from your own URLs, set Synerise.settings.inAppMessaging.contentBaseUrl and use relative paths in HTML/CSS.

Configuration

In-app message campaigns are served by the Synerise backend.

Check possible available configuration options in the Settings.

JavaScript methods in in-app messages

See "Using in-app template builder" in the User Guide.

Events generated by in-app messaging

For information about events generated by in-app messaging, see the event reference.

NOTE: You can disable sending the inApp.capping event in the SDK Settings - Enable/disable sending in-app capping event.

Setting up a global control group for in-app message

For information about global control groups in in-app messages, see the global control group article.

Handling actions from in-app messages

Handling main actions from campaigns depends on the campaign type and operating system and it is described here.

Implementing in-app messages in the application

See Overlay in-apps and Inline in-apps