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](/docs/campaign/in-app-messages/introduction-to-inapp-messages).


<div class="admonition admonition-warning"><div class="admonition-icon"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2.5"><path stroke-linecap="round" stroke-linejoin="round" d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-2.5L13.732 4c-.77-.833-1.964-.833-2.732 0L4.082 16.5c-.77.833.192 2.5 1.732 2.5z" /></svg></div><div class="admonition-body"><div class="admonition-content">

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.

</div></div></div>


## 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](/developers/mobile-sdk/settings#content-base-url-for-in-app-message)).
- Enable the `IN_APP_DEFINITIONS_COMMUNICATION_READ` (**Experience Hub**) permission in the Profile (formerly Client) [API key](/docs/settings/tool/api) used by the mobile application so the mobile application can fetch in-app messages.  
    <figure><img src="/api/docs/image/8aa18695b9ddf90415ab9b9c2fdf6e90734cca60/docs/campaign/_gfx/permission-for-in-app.png" class="full" alt="The API key permission matrix with the in-app permission"><figcaption>The API key permission matrix with the in-app permission</figcaption></figure>
- **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](/developers/mobile-sdk/settings#in-app-messaging).

## JavaScript methods in in-app messages
---

See ["Using in-app template builder" in the User Guide](/docs/campaign/in-app-messages/creating-inapp-templates/creating-inapp-template#javascript-methods-in-in-app-messages).

## Events generated by in-app messaging
---
For information about events generated by in-app messaging, see the [event reference](/docs/assets/events/event-reference/inapp).


<div class="admonition admonition-note"><div class="admonition-icon"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2.5"><path stroke-linecap="round" stroke-linejoin="round" d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" /></svg></div><div class="admonition-body"><div class="admonition-content">

You can disable sending the `inApp.capping` event in the SDK Settings - [Enable/disable sending in-app capping event](/developers/mobile-sdk/settings#enabledisable-sending-inappcapping-event).

</div></div></div>


## 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](/docs/settings/configuration/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](/developers/mobile-sdk/campaigns/action-handling).

## Implementing in-app messages in the application
---
See [Overlay in-apps](/developers/mobile-sdk/campaigns/in-app-message/overlay-in-app) and [Inline in-apps](/developers/mobile-sdk/campaigns/in-app-message/inline-in-app)