Gist
Search…
Getting Started
Everything you need to know about Gist.
This guide will walk you through the basic setup of Gist, how to install the library, and send a personalized message to a customer.
Adding the Gist library
Web
iOS
Android
React Native
Flutter
The Gist library can be added either via an NPM package or by using the script directly.
​
NPM Package
1
npm install --save @gistproduct/web
Copied!
Import the dependency into your file
1
import Gist from '@gistproduct/web';
Copied!
​
CDN
1
<script src="https://code.gist.build/web/2.10.0/gist.min.js"></script>
Copied!
Add the Gist pod into your Podfile
1
pod 'Gist', '~> 2.1.0'
Copied!
Add the Gist library to your app's build.gradle
1
implementation 'build:gist:2.+'
2
​
3
repositories {
4
maven {
5
url 'https://maven.gist.build'
6
}
7
}
Copied!
Add the Gist library via NPM
1
npm install @gistproduct/react-native
Copied!
​
Open the
build.gradle file located inside the android directory and add the Gist maven repository. 1
allprojects {
2
repositories {
3
...
4
maven { url 'https://maven.gist.build' }
5
}
6
}
Copied!
​
Link the Gist pod with react native project
1
npx pod-install
Copied!
Add the Gist library
1
dependencies:
2
flutter:
3
sdk: flutter
4
​
5
gist_flutter: ^1.1.1
Copied!
​
On Android
Open the Project build.gradle file and update your kotlin version
1
ext.kotlin_version = '1.5.30'
Copied!
Open the App build.gradle file and update the minimum SDK version
1
minSdkVersion 19
Copied!
Note: If a version is higher then the one specified here, you can leave it as is.
​
On iOS
Open the project's .xcworkspace file, select the project and make sure the deployment target is 10 or higher.
​
Setting up Gist
Web
iOS
Android
React Native
Flutter
1
Gist.setup({ organizationId: "your-organization-id" });
Copied!
1
Gist.shared.setup(organizationId: "your-organization-id")
Copied!
1
GistSdk.getInstance().init(this, "your-organization-id")
Copied!
1
Gist.setup("your-organization-id");
Copied!
1
Gist.setup("your-organization-id");
Copied!
Identifying your customers
Link your unique customer identifier to Gist
Web
iOS
Android
React Native
Flutter
1
Gist.setUserToken("unique-user-token");
Copied!
1
Gist.shared.setUserToken("unique-user-token")
Copied!
1
GistSdk.getInstance().setUserToken("unique-user-token")
Copied!
1
Gist.setUserToken("unique-user-token");
Copied!
1
Gist.setUserToken("unique-user-token");
Copied!
Previewing a message
The message editor enables you to preview messages directly in your product. To make the message feel more personal, we're going to include the customer's name.
Added $properties.name to the markdown component
In the preview screen, we add an example name property, choose the modal position, and input our unique user token (your unique user identifier)
Congratulations! You managed to integrate the Gist library and send your first message. If you're interested in integrating Gist with your router to show messages on specific screens, subscribe to topics so that you can send broadcasts, and more. Every library has its own documentation:
Ways to send messages
Gist supports both direct user messages and broadcasts, this means that you can either send personalized messages directly to a specific user or reach an audience within your user base.
If you're looking to send personalized in-app messages or reach an audience using data from your CRM our webhook can help you achieve that.
To reach audiences with no additional integration, Gist offers a feature called Broadcasts. This enables you to schedule and send in-app messages from our app.
Support
If you have any questions or need help setting up Gist you can reach us using live chat or through email.
Last modified 9d ago