Similar to adding the assistant to your website, you can add the assistant to your mobile app. This allows users of your app to seamlessly benefit from features such as self-service troubleshooting and live support without needing to switch to a separate web browser app.
Note that this does still require the user to have a working Internet connection.
Prepare code snippets
- Navigate to Settings by clicking the hamburger menu in the top left and selecting "Settings".
- Under "Assistant", select "Embed and share".
- If it isn't already selected, select the "Mobile" tab.
- If you want the embedded assistant to open a particular flow, select it from the "Select a flow to embed" dropdown menu.
This will generate code snippets that you can use for the following steps.
Set up the landing page
Your app must open a webview (an in-app web browser) and display a landing page which will include an embedded assistant. Mavenoid can create and host this page for you; please reach out to [email protected] to coordinate this if you are not already in touch with a Mavenoid representative.
We strongly recommend allowing Mavenoid to host the landing page for ease of setup and the ability to update your configuration without needing to push an update to your app.
If instead you need to self-host the landing page, you can use the HTML code in the "Create a landing page for the Mavenoid widget" section of the Embed & Share page.
For more information on customizing this code, see Assistant embed API.
Add the code to your app
Your app will need to contain code to open the webview to the landing page. The "Embed the following code in your app" section of the Embed & Share page contains sample code you can use.
- Select the code sample that matches your app platform between iOS (Swift), Android (Kotlin), and Android (Java).
- Click "Copy code" to copy the selected sample.
- Paste the code into your app.
- The code includes the string
<YOUR_LANDING_PAGE_URL>. Replace this with the URL to your landing page. (If Mavenoid is hosting your landing page, they will provide you with this URL.)
- Publish the code in your app and test it.
Optional: Customize the app code
If necessary, you can modify the app code as needed for your particular app. Note that the samples do a couple things for you that we recommend you leave intact.
Handling the close event
The app needs to be notified when the assistant is closed so that it can close the webview. Otherwise, when the user closes the assistant the webview will remain open on a blank page.
In the provided code snippets, the app closes the webview when the webview navigates to the special URL
close:. This behavior is itself determined by the code snippet in the landing page; see Assistant embed API -
onClose for details.
By default, links clicked within a webview will open within the webview. In most cases this is not the desired behavior. In the provided code snippets, the webview is configured to instead open links in the mobile device's default web browser app.
Optional: Pass in data
If you need to pass data from the app into the embedded assistant, you can do so by using form data.
The simplest option is to add data to the URL accessed by the webview. For example, if you need to pass a country code into the assistant, you can do so by having the app navigate the webview to a URL like the following:
This data will then be available within the flow and conversation transcript within the special form data key
$created-on-page-url. See Understand form data - From the URL.
Alternately, you can update the
mavenoid.push call to include the