Track your SMS campaigns in Google Analytics with Reshuffle and Twilio

Google Analytics is a powerful tool that provides valuable information about your website. It lets you know who your visitors are, what content they want to see, and how they behave when interacting with the application. Most of the time, this data is collected on the client, being that it's the browser, you’ll have easy access to user specific attributes. Client-side tracking is also very simple to configure, Google Analytics (GA from here on) provides a snippet of code that’s as easy as copying and pasting into the HTML to implement.

What if you or your marketing team wanted to track “offsite” events, like triggering an action while not interacting with the website or app? Let’s say you have an SMS marketing campaign powered by Twilio, and instead of using the new Messaging Insights in Twilio’s dashboard for analytics, your marketing team prefers GA. The solution for this is server-side tracking, rather than data collection from the web browser (client), events are collected on the backend server. This type of tracking is often seen as difficult to build but in this article, we’ll see how easy it is to send custom events directly to GA with Reshuffle.

How to Build It

We’ll continue with the SMS example to send data directly to GA anytime a Twilio number receives an incoming text message. You’ll notice two services at play here. Reshuffle makes it easy to build integration between services, so you can deliver unique experiences and outcomes for the business and customers.

To get started, we’ll need credentials from the services:

Tracking ID from GA:

• Log in to Google Analytics Platform
• Click on 'Admin' > 'Create a property'
• Enter a property name
• Click on 'Show Advanced Options'
• Switch on 'Create a Universal Analytics property'
• Select 'Create a Universal Analytics property only'
• In Website URL, use your Reshuffle runtime URL
• Click 'Next' then 'Create'
• Copy your tracking ID (e.g. UA-XXXXXXXXX) as you will need it later in the configuration portion.

Twilio Credentials:

• Create a free Twilio account
• Copy the Account SID, Auth Token and generate a phone number as you will need it later in the configuration portion

Note: Please see instructions on how to test Twilio webhook locally. To set up the webhook, select phone number, scroll all the way down to messaging, add method and path, save.

Reshuffle is an open source, lightweight, and event-driven framework that helps you integrate services — these integrations and workflows are created inside a Reshuffle App. The objects that let you interact with these services are called connectors.

See links for full documentation:

• Reshuffle
• Google Analytics Connector
• Twilio Connector

Let’s start coding. We'll need to require the packages for this example. Then initiate a Reshuffle app and configure Twilio and GA connectors with the credentials we got earlier.

const { Reshuffle, HttpConnector } = require("reshuffle");
const { TwilioConnector } = require("reshuffle-twilio-connector");
const { GoogleAnalyticsConnector } = require("reshuffle-google-connectors");

 const app = new Reshuffle();

 const twilioConnector = new TwilioConnector(app, {
   accountSid: process.env.TWILIO_ACCOUNT_SID,
   authToken: process.env.TWILIO_AUTH_TOKEN,
   twilioNumber: process.env.TWILIO_NUMBER,
 });

 const gaConnector = new GoogleAnalyticsConnector(app, {
   trackingId: process.env.GOOGLE_UA_TRACKING_ID,
 });

 // Code listed further down
 // will be inserted here

app.start()

As Reshuffle is an event-driven framework, we’ll need to define what event we need to listen to. In this case, with the Twilio connector, we can listen to incoming SMS on the Twilio number.
We are able to extract both the message and the phone number from the event. If you or your marketing team want to save this information, we can do that using another Reshuffle connector, but we’re here to send this event directly to GA. To do this, we use the GA connector action trackEvent.

Note: Parameters for trackEvent(category: string, action: string, label?: string, value?: string|number)

 twilioConnector.on({ method: "POST", path: "/sms" }, async (event, app) => {
   const messageReceived = event.req.body.Body;
   const fromPhoneNumber = event.req.body.From;
   console.log(`New SMS received from ${fromPhoneNumber}: ${messageReceived}`);

   await gaConnector.trackEvent(
     "SMS", //category
     "SMS Received", //action
     "user engagement" //label
   );
 });

And that's it! With minimal code you can send custom events directly to GA for your marketing team to review. If you try this out, your realtime GA dashboard would look something like this:

Now, Make it Happen

As your developers and project management teams experience the ease of working with integrated applications, we encourage you to consider where else integrating workflows would benefit your teams. With so many different tools, the more you can consolidate them into one common interface, the easier people can get work done.

Reshuffle is continually listening to what our customers need and desire. Don’t see a Connector to a service you’d like to integrate? Send a tweet to @ReshuffleHQ to let us know which Connector you’d like us to develop next.