Anatomy of the Integration Script
- 1 Overview
- 1.1 Initialize Function
- 1.1.1 Attributes
- 1.2 Data{} Object
- 1.2.1 Attributes
- 1.2.2 Shopify data{} Example
- 1.2.3 Square Online data{} Example
- 1.3 Variables{} Object
- 1.3.1 Attributes
- 1.3.2 Code Example
- 1.4 Theme{} Object
- 1.4.1 Attributes
- 1.4.1.1 Colors{}
- 1.4.1.1.1 Customized Colors Example
- 1.4.1.2 Borders{}
- 1.4.1.2.1 Customize Borders Example
- 1.4.1.1 Colors{}
- 1.4.1 Attributes
- 1.5 Behavior{} Object
- 1.5.1 Attributes
- 1.6 URI Source
- 1.1 Initialize Function
Overview
The ICS integration script is your gateway to installing ICS widgets and tools your site. The script takes in a host of options and settings, communicates those to the ICS JS SDK and API which in turn returns appropriately configured content. Installing this script is the primary way that ICS is integrated on client pages.
This article breaks down the main pieces of this script, describes their purpose and provides a reference that includes supported variables and their accepted inputs.
Initialize Function
The ICS.init()
function is a key component to running the ICS app. Essentially it tells the widget to initialize with the configuration data provided.
It contains many variables like which version of the widget should be loaded, which campaign to pull assets from and even what language should be used. Beyond that, it includes a handful of objects like data, variables, and theme which provide organized sets of options used to tweak and configure the widget.
Attributes
Name | Description | Format | Required | Accepted values |
---|---|---|---|---|
| controls what the user sees and when and where they see it | Object | REQUIRED |
|
| A unique number assigned to each ICS campaign | String | REQUIRED | Client campaign ID |
| Data passed to the widget for attribution | DataLayer Object | REQUIRED |
|
| Determines the locale to used for the widget content and display. Defaults to browser language but can be set in the admin or specified directly in the script. | String | oPTIONAL | |
| A 32-character alphanumeric string unique to each ICS client | String | REQUIRED | Client public key |
| Provides options for applying custom themes to the widget | Object | oPTIONAL | |
| Optional variables to be replaced in the widget | Object | oPTIONAL |
|
| The version of the widget to use. If unspecified, this defaults to ‘latest’ | String | oPTIONAL |
|
Data{} Object
For the ICS widget to create and track influencers and referrals, certain pieces of data need to be fed to the script. To do this, you’ll have to map the attributes in the data{}
object to the equivalent values used in your system.
Not all of the fields are required, but we recommend using as many as your data usage policies allow so ICS can collect the most data possible for you.
Attributes
Name | Description | Format | Required | Accepted values |
---|---|---|---|---|
| Customer’s unique ID granted by your platform. Used if you would like to tie the influencer account to their account in your system | String | Optional | Any |
| Passing email allows user to bypass the email entry step if the client's GDPR settings allow | String | Optional | Any email |
| If no engagement is passed, the widget will automatically detect engagement type based on the following conditions:
If you would like to record a signup, or explicitly set a specific engagement, pass it here. | String | Optional |
|
| The invite id for conversion attribution. Populated automatically when a customer was invited.. | String | Optional | Invite id number |
| Influencer’s name | String | Optional | Any |
| Unique ID tied to an influencer’s order | String | REQUIRED if subtotal is > 0 | Any |
| Customer’s phone number to be used for SMS notifications | String | REQUIRED if email not provided | Any phone number |
| If tracking influencer order total | String | REQUIRED for post-purchase campaigns | Any number |
|
| String | REQUIRED if subtotal is > 0 | Any |
Shopify data{}
Example
If you were using Shopify, you’d change the variables to their Shopify specific equivalents so ICS can capture the correct info, the result would look like this:
data: {
accountId: '{{checkout.customer.id}}',
email: '{{checkout.email}}',
name: '{{checkout.customer.first_name}} {{checkout.customer.last_name}}',
phoneNumber: '{{checkout.customer.phone}}',
orderId: '{{checkout.order_number}}',
revenue: '{{ checkout.line_items_subtotal_price | money_without_currency }}',
transactionId: '{{transactions[0].receipt.transaction_id}}'
}
Square Online data{}
Example
Most variables are not standardized and are platform specified. For example, Square Online’s syntax is much different than Shopify’s: