Integrating with Customer.io
UpdatedWe offer a number of ways to get data in and out of Customer.io. This flexibility ensures that you can activate your data in Customer.io and that your data is never stuck with us; you can take advantage of your data in any number of downstream platforms. This page provides some basic instructions to get you started, including how to get your data flowing through Customer.io!
1. Add a JavaScript integration
Our JavaScript client feeds data inAn integration that feeds data into Customer.io. to Customer.io from your website. You’ll add data in integrations for every system or touchpoint you want to collect data from.
- Go to Data & Integrations > Integrations and click Add Integration.
- Select our JavaScript integration.
- Enter a Name for the integration and click Submit. You should give your integration a name that helps you and your teammates understand the resource you’re capturing data from—like “company website” or “community forums.”
- Under Installation Instructions, you’ll find the JavaScript snippet that you need to add to your website. Copy this code and paste it in your website’s
<head>tag. - Click Test connection to make sure that everything is setup correctly. If you want to skip this step, click Save & complete later. Otherwise, if your test is successful, click Complete Setup.
That’s it! Now you’re ready to capture data from your website.
2. Make a page call
Go to the website where you installed the JavaScript snippet in the steps above and visit a few pages. In Customer.io, go back to your integration’s Data In tab. You should see page events!
Do you have a single page app?
The snippet automatically calls cioanalytics.page() when the snippet loads. If you have a single page app (SPA), it’s likely that each route isn’t necessarily a new page, so you’ll need to call cioanalytics.page() manually for each route in your app.
A page event represents a page view—a page someone visited in your website or app. The JavaScript snippet automatically captures page events.
However, these events are still anonymous. You’ll need to set up identify calls and other events to associate anonymous data with people you know. You can identify people when they provide their email address on a form, login to your website, and so on. See our JavaScript integration for help implementing the full array of events you can (and should) capture from your website.
While your integration might change, our event types don’t. You can capture the same events—or a subset of events—from the integrations we support.
3. (Optional) Add a data-out integration
You can send data to analytics platforms, CRMs, support tools, or other marketing platforms from any of your sources. We reshape incoming data to fit the platforms you integrate with.
Go to Data & Integrations > Integrations and click Add Integration.
Select the service you want to send data to. Make sure that it’s labeled Data out; we support bidirectional integrations for some services.
Configure your integration. Each integration has its own settings. See our integration directory and select your integration to get detailed instructions.
As you set up your data out integration, select the JavaScript client you set up in earlier steps. This lets you send data from your website (using the JavaScript integration) to your new destination!
Click Enable Integration.
If you go back to your website and reload a page, you’ll see data flowing right away! These are anonymous page events—pageviews. But, to take advantage of data in your destination, you’ll need to implement the identify method.
Add identify, track, and other calls to your website to get the most out of Customer.io and send actionable data to your destinations.
4. Validate your implementation
When you look at an integration, you can go to the Data in or Data out tab to see the individual events that flow through Customer.io.
You can use these tabs to make sure that the calls you make to Customer.io are set up properly and mapped correctly to your outbound integrations. These pages show events as they come in—a nearly live stream.
Events and Actions: How we map source data to destinations
Your JavaScript integration includes a Data In tab that shows calls that you make in our JavaScript client library or in our server side libraries. These calls represent things that people do on your website or in your app. For example, when you identify a person, you’ll see an identify call come into Customer.io.
You can check these events to make sure that you’re sending the right information into Customer.io.
When you set up a destination, you’ll see an Actions tab. An action determines the data that we map to your destination. In most cases, you’ll want to stick with our default actions. But you can customize these if you want—like if you want to filter out specific incoming data for a destination or map specific event names to actions in your destination(s).
Be careful when editing actions for your workspace
The Customer.io integration is how data gets into Customer.io—the people, events, and other data that you’ll use to send messages to your audience. It’s already configured with actionsThe source event and data that triggers an API call to your destination. For example, an incoming identify event from your sources adds or updates a person in our Customer.io Journeys destination. to support incoming data. You can edit these actions if you want to change how we handle incoming data, but take care not to inadvertently break integrations with Customer.io.
