VIDEO TUTORIAL

How to Add Events and Attributes in Sprig

Hello! Welcome to our guide to adding Events and Attributes to Sprig.

Events and Attributes are two key pieces of information that you can use to create a run targeted in-product studies in Sprig. Events determine when a study should appear (such as when a user visits a particular page in your product), while Attributes define who is eligible to see a study based on certain user characteristics (such as their plan type or country). Events and Attributes are essential to launching Sprig studies in your web or mobile product, but they are not needed for Shareable Link studies.

Before you can start adding Events and Attributes, you need to install the Sprig SDK. There are three main installation methods, Segment, Google Tag Manager and Javascript. Feel free to refer to those tutorials for more details around installation.

Let’s start with Events. With each of these installation methods, you have the option of adding No-Code Events directly in the Sprig app. No Code Events can be created to trigger basic Events like those based on a URL, Inner Text Match or CSS selector. For more complex Event types, you will need to build a Code Event to trigger the study, which we’ll walk through shortly.

When Sprig receives an Event, the study is displayed if the user is eligible to receive that study. You can see the overall user traffic here in the “Activity” column.

Let’s move onto Attributes, which you can send to Sprig for additional targeting capabilities. If using Segment or Google Tag Manager, Attributes can be passed along to Sprig through some simple configuration decisions that we’ll review in just a moment. If you are installing Sprig through the Javascript snippet, you’ll need to manually set desired Attributes for your users.

Segment

First, we’ll walk through how to add Events and Attributes with Segment. Let’s navigate to our Integrations page and select Segment.

If you installed Sprig with Segment, you likely already have Events sending from Segment to Sprig. By default, the installation will automatically enable sending Identify, Alias, Track and Sign out triggers that are already built in your Segment source. In addition, with the default installation, user traits from Segment will also be passed along to Sprig in the form of Attributes.

Google Tag Manager

For Google Tag Manager, there are three main steps you’ll need to take to generate triggers that can be used by Sprig to display a study:

Create and configure the Trigger as a Variable in GTM.
Create the Sprig Tag and associate the Trigger to the Tag.
Publish your changes to the server.

Let’s walk through these 3 steps with an example. Let’s say you want to display a study when users click a button labeled CONTACT on a specific web page. This example will use the GTM built-in variable Click Text for targeting the button label in the CSS of a page.

In the Google Tag Manager app, click Variables.
In Built-in Variables, click Configure.
Click on the Variables you want to enable. In this example, we will use Click Text.
Now click on Triggers to create a trigger using the Click Text variable.
Click New.
Click Untitled Trigger and give the trigger an appropriate name, for example, Contact Button Click.
In Trigger Configuration, click or to choose the trigger type.
Select Click - All Elements as the trigger type.
Now click Some Clicks.
In the first item list, make sure Click Text is selected.
In the second item list, make sure contains is selected.
In the text box, type in the button label; in this example, CONTACT.
Click Save.

Since the Sprig Tag has already been installed you will need to add this new Trigger under the Tag. If you have not already installed GTM reference install walkthrough video.

Select your “Sprig Install Tag”
In Triggering, click or
Click on the + Button
Select Contact Button Click as the trigger.
Click Save.
Click Submit and then Publish to push your changes out to the server.
Test the trigger by clicking the button and navigating to the Events page in the Sprig app. You may have to click Browser Reload to refresh the Events page contents.

In addition to Events, you can also send Google Tag Manager’s user-defined variables through to Sprig, where they can be used as Attributes. Let’s demo that process:

In the Google Tag Manager app, click Variables.
In User-Defined Variables, click New.
Click Untitled Variable and give the variable an appropriate name, for example, Get Day.
In Variable Configuration, click or to choose the variable type.
Select Custom Java Script as the variable type.
Paste in the following JavaScript in the field and click Save.

Javascript

Last, but not least, let’s walk through the process of adding Events and Attributes with Sprig’s Javascript SDK. For a standard Javascript SDK installation, you will want to use the Sprig.track method for creating a Code-based Event.

To add or track a Code Event for triggering or filtering, you will need a specific snippet, which you can find in the Javascript card in the Sprig Integrations Gallery.

After sending a new Code event to Sprig, you must approve the new event request on the Events page before it can be used to trigger or filter surveys. Be sure that the Event name used in Sprig is identical to the name used in your snippet. You can also optionally add properties to your Event.

Let’s switch gears to sending Attributes with the Javascript SDK. With the Javascript installation method, the Sprig SDK automatically tracks default Attributes including Browser and version, Device, Session count, and Page URL. In order to create additional custom Attributes on a visitor, you will want to employ the Sprig set Attribute methods. The set Attribute methods for both HTML script and NPM installation.

And you're done!

That wraps up our overview of creating Events and Attributes in Sprig across Segment, Google Tag Manager, and Javascript! If you have any more questions about the process, head over to Sprig’s documentation at docs.sprig.com.