Powered by GrowthLoop Embed
Learn how to embed GrowthLoop audience building into your application
In this article, you will learn how to embed GrowthLoop's audience builder into an internal application or system. You can also embed our composable audience builder directly into your CRM.
Audience Builder iFrame Embed
This iFrame component enables you to embed GrowthLoopโs fully functional audience builder into your web application including audience inclusions, exclusions, user filters, transaction filtering, and more. You can configure what type of Audience Builder you would like to display that works for your user interface. Below is a compact version and an expanded version.
(see the Authentication section for full parameters)
/embed?organization_id=\<ORGANIZATION_ID>&team_id=\<TEAM_ID>7embed_path=%2Faudiences%2Fnew&...
Exports Embed
The embed brings GrowthLoopโs destination sync into your application. Users can choose to export an audience. Users can select a destination that has been connected to the platform (50+ available). Users can then configure the frequency of how often they want their audience to sync to the destination platform.
Destination Export Configuration
The embed enables your end users to configure their export to the Destination for their audience.
Once they click export the audience sync will begin to their destination all from your interface โ
Audience List
You can embed our Audience List page in your interface or use our API to get a list of audiences and bring it into whatever UI you would like to use.
Audience List Embed
Embed our Audience List directly in your interface with this iFrame path:
<https://app.flywheelsoftware.com/embed?team_id=203&organization_id=190&embed_path=%2Faudiences>...
Audience List API
You can list all audiences for a specific team and organization with metadata via GrowthLoopโs API.
Shared Data Layer
GrowthLoop writes all audiences and journey states to your Warehouse so you have full access. Here is a summary of the underlying data schemas.
snapshotting_audience_{id} _snapshot_history
Stores all the snapshots for the audience in the table
snapshotting_audience_{id} _delta_history
History of all the adds/removes for an ongoing audience sync. Along with the control/treatment assignment.
snapshotting_audience_{id} _metadata
Audit log of each run of audience snapshotting.
Administrative Support for Embed
Setting up Datasets for audience building (Help Center)
- Support Admins can log in to app.flywheelsoftware.com
- Admin can switch to Org and Team they want to set up destinations for.
- Admin clicks Datasets menu tab
- Admin can configure datasets for audience building.
- Admin can view all datasets set up for that org.
Setting up Destinations (Help Center)
- Support Admins for your organization can log in to app.flywheelsoftware.com
- Admin can switch to Org and Team they want to set up destinations for.
- Admin clicks Destinations menu tab
- Admin can set up destinations for customers leveraging customer credentials.
- Admin can view all destinations set up for that organization.
Managing Orgs and Teams (Help Center)
Support Admins can quickly switch between different orgs and teams they are attached to.
On the Organization tab Support Admins can manage which users are associated with each team. Support Admins can also create new teams for the organization and assign users.
Creating a new Organization
On the Manage tab, Support Admins can view all organizations they have set up and are a part of (your customers).
We are adding support for Support Admins to directly create a new Organization directly from this tab. For now, to create a new organization, get in touch with your dedicated solutions architect to setup the Org and ensure you have access ([email protected])
Authentication
The source of the iframe will be /embed
. The path you are requesting will be included as a parameter embed_path
. This ensures the parameters can be verified before using the app.
The parameters are:
- organization_id: (integer) id of your organization
- team_id: (integer) id of the team to be used
- access_key: (string) the access key from API Key generated in the GrowthLoop UI
- user_email: (string) the email address of the user accessing the app
- user_name: (string) the name of the user accessing the app
- session_length: (integer) the length of inactivity before the session expires, in seconds
- nonce: (string) a random non-repeated base64 value
- embed_path: (string) the path being requested
/audiences/new
create a new audience/audiences/edit
edit page for existing audience, requires passing id as a parameter/audiences/show
show page for existing audience, requires passing id as a parameter
- id: (optional, integer) the id of a single record, (ex. an audience id)
- signature: (string) the encoded value of the other parameters
In order to generate the signature
you will need to use the secret key that is provided when you first generate a new API Key.
The string that is encrypted with the secret key has each string value cast to JSON, each integer value must be an integer, a new line between each value, and UTF-8 encoding enforced. No new line after the last value. The values are done in the following order:
- organization_id
- team_id
- access_key
- user_email
- user_name
- session_length
- nonce
- embed_path
- id - only if passing value, otherwise not included
The above are then used with HMAC digest, SHA256, and base64 URL encoded to produce the signature.
For example:
string = [
organization_id.to_i,
team_id.to_i,
access_key.to_json,
user_email.to_json,
user_name.to_json,
session_length.to_i,
nonce.to_json,
embed_path.to_json,
id.to_i # optional
].join("\n")
signature = Base64.urlsafe_encode64(
OpenSSL::HMAC.digest(
OpenSSL::Digest.new('sha256'),
api_secret_key,
string.force_encoding('utf-8')
),
padding: false
).strip
let string = [
parseInt(params.organization_id),
parseInt(params.team_id),
JSON.stringify(params.access_key),
JSON.stringify(params.user_email),
JSON.stringify(params.user_name),
parseInt(params.session_length),
JSON.stringify(params.nonce),
JSON.stringify(params.embed_path),
parseInt(params.id) // optional
].join('\n');
let signature = crypto.createHmac("sha256", api_secret_key).update(Buffer.from(string, "utf8").toString()).digest("base64url");
Embed Users
The email passed in the user_email
parameter is used to look for any existing users with that email address. If no user is found we create a new one and they are given the "User" role, (lowest permissions level). We also check to see if the user is part of the team (team_id
) that is past. If they are not then they will be added to that team.
Please note that SSO is not used as part of authenticating users via embed. Users created through embed will not have the ability to login to the full application.
Updated 8 months ago