The Customer.io integration includes two components:
- Data Destination -- send Chameleon data to Customer.io (to use in sending other messaging, such as emails)
- Data Source -- get Customer.io data (webhooks) into Chameleon (for targeting Tours and personalizing content)
This integration enables Customer.io to be a Data Destination -- you can send Chameleon data to Customer.io.
We are also in *beta* for Chameleon as a Data Source -- see below and email us if you'd like access.
The Customer.io integration can be enabled with a single click. Simply visit the Integrations section within the Chameleon Editor, select Customer.io and then hit: "Connect to Customer.io".
This will automatically begin sending data to your Customer.io account. This works by using the existing Customer.io tracking code on your website, and so data will only be sent on pages where the Customer.io code is present and working.
Chameleon will automatically send tour performance data, for each user, and you can view this within your Customer.io account, on the Activity page:
The events sent by Chameleon are:
- Started Tour (Chameleon)
- Completed Tour (Chameleon)
- Exited Tour (Chameleon)
- Step Seen (Chameleon) -- by request, to avoid flooding you with events.
- Previewed Tour (Chameleon) -- for admins only
Event properties sent as part of these events include the Tour name, URL and others (e.g. Step number) where relevant.
You can then use this activity by users to be a part of an event triggered email campaign. You can also use these events as part of your Customer.io segments, which can then be further used for any notification or message you send via Customer.io.
Customer.io webhooks (new)
You can now send data from Customer.io to Chameleon in real-time using webhooks. You can send event or property webhooks to Chameleon, which can help you:
- Trigger Chameleon Tours (based on matching)
- Update user data (for targeting)
- Personalize content within Tours
X-Account-Tokenas a header with the token copied from the code installation page
- Send a
- Add data/content as properties in the request body
Example: Customize Tour content
First Step body content
What fields can be sent to the webhook in the JSON payload?
The webhook can be configured to "set user properties" or "log an event" simply by using a different endpoint in the Chameleon REST API. For the case of sending user properties you can send anything you would otherwise send to
For example you could set a property when a user reaches a milestone in your application, such as
upsell_readiness_score, and use this as a filter within a Target Audience to show an Experience (e.g. prompting user to book a sales meeting).
What fields cannot be sent to the webhook?
Certain attribute names are reserved. These include
created_at and are listed here.
While nested field two-levels deep are supported, further nesting (object within object within object) is not.
How do we map Customer.io User IDs to Chameleon UIDs?
Typically the 'User ID' (UID) you send to Chameleon (within the
chmln.identify call) is a Database ID and thus also used to identify users within Customer.io.
To check the UID being sent for any Chameleon user, open the developer console and enter
What limitations does the webhook have?
You're allowed to do anything with the Chameleon API that you'd otherwise have access to do.
What is the REST API endpoint for Show a Tour?
There is no need for a REST API endpoint because the JS API for "Show a Tour" works by showing the Tour including redirecting to the right page etc. This can be achieved without the API by using a Tour link (for Tours with Manual Delivery) or by sending an event and using that as a condition to show an Automatic Tour.
What is the REST API endpoint tp personalize content?
All user properties are available for use as content. You basically set user properties via the /profiles endpoint.
We are not currently aware of any common problems experienced as part of this integration, so please message us if you have any issues, or ideas for improvements. Simply use the green chat circle on the bottom right of this screen. ↘️