Integrating SiteSpect and FullStory

SiteSpect integrates with various third-party data management platforms to allow you to use SiteSpect data in analysis.

The steps described here tell you how to integrate SiteSpect with FullStory. These instructions are intended for a user who has some experience with FullStory and who has sufficient permissions to implement code changes on your website.

The instructions are meant to provide a high-level framework through which you can design your own integration strategy.

Overview

FullStory is an easy-to-use digital intelligence and session replay tool. Integrating FullStory with SiteSpect allows you to transfer information from SiteSpect Campaigns to FullStory to use in solving problems, finding answers, and fine-tuning your customer experience.

The integration entails creating a Site Variation in SiteSpect.

Creating a Site Variation

A Site Variation is a SiteSpect Variation that applies to all Campaigns and can be setup to apply only to users assigned to a Campaign. When you create a Site Variation with the FullStory code, SiteSpect injects the code as part of all Campaigns.

  1. Click New, then Global Variation.
  2. Enter a Name, such as FullStory Site Variation.
  3. Leave the Type set to Regular.
  4. Select or create Tags as you need them.
  5. Leave the Scope set to Site (the default).
  6. The default Status is Inactive. Remember to change the Status to Active when you want this Site Variation to be applied.
  7. Open the Triggers area and click the plus (+) at the right edge of the Triggers area.

Integrating SiteSpect and FullStory - Creating a Site Variation

  1. Select Page Source and click Add. SiteSpect adds the Page Source Trigger to the Triggers area of the page.
  2. In the Page Source field, enter </head>.
  3. Create a second Trigger by clicking the plus (+) again, but this time select Header.
  4. In the Header Name field, enter content type. In the Header Value field, enter html.

From here, there are two ways to continue. One method works for scenarios in which you’re implementing FullStory using SiteSpect. The second method works for implementing FullStory using some other tool, i.e., not using SiteSpect.

Implementing FullStory Using SiteSpect

If you are implementing FullStory using SiteSpect:

  1. Log in to FullStory.
  2. Select SettingsFullStory Setup.
  3. Copy Your Recording Snippet. The snippet is FullStory’s JavaScript that must be added to the website for FullStory to be able to record user sessions and play them back later for the client.
  4. Paste the recording snippet into a text editor and modify it as follows.
  5. Add the following below the line that says window['_fs_namespace'] = 'FS';
window['_fs_ready'] = function() {
setUserAssignments();
};

let appliedSsVariations = "__SS_LISTVAR{__SS_TCID__:__SS_VGID__:__SS_VID__:__SS_VNAME__}{;}__";

let userCampaigns = "__SS_LISTCAMPAIGN{__SS_TCID__:__SS_TCNAME__:__SS_VGID__:__SS_VGNAME__}{;}__";
  1. Before the closing script tag add:
function sendFsEvent(assignmentString) {
var stringSplit = assignmentString.split(':');
var userCampaignID = stringSplit[0];
var variationGroupID = stringSplit[1];
var variationID = stringSplit[2];
var variationName = stringSplit[3];
var campaignName = "";
var variationGroupName = "";

if(userCampaignID !== "0"){
var campaignsSplit = userCampaigns.split(';');

for(let x = 0; campaignsSplit.length > x; x++){
var currentCampaign = campaignsSplit[x].replace(';', '');
var splitNames = currentCampaign.split(':');

if(userCampaignID === splitNames[0]){
campaignName = splitNames[1];
if(variationGroupID === splitNames[2]){
variationGroupName = splitNames[3];
}
}
}
}

FS.event('SiteSpect Variation Applied', {
campaignID: userCampaignID,
campaignName: campaignName,
variationGroupID: variationGroupID,
variationGroupName: variationGroupName,
variationID: variationID,
variationName: variationName
});

}

function setUserAssignments(){
if(appliedSsVariations !== "") {
var stringToSlice = appliedSsVariations;
var assignmentCount = (stringToSlice.match(new RegExp(";", "g")) || []).length + 1;

for (let x = 0; assignmentCount > x; x++) {

if (stringToSlice.indexOf(":") > -1) {
var indexOfSemicolon = stringToSlice.indexOf(";");

if (indexOfSemicolon > -1) {
var sliceOfAssignments = stringToSlice.slice(0, indexOfSemicolon + 1);

stringToSlice = stringToSlice.replace(sliceOfAssignments, '');

sliceOfAssignments = sliceOfAssignments.replace(';', '');

sendFsEvent(sliceOfAssignments);

} else {

sendFsEvent(stringToSlice);
}
}
}
}
}
  1. In SiteSpect, open the Search & Replace area. In the Search Text field add </head>.
  2. In the Replacement Text field paste the script from the script editor and add </head> after it.
  3. Click Save at the bottom of the page. When you set it to Active, it will run with all your Campaigns.

Implementing FullStory Without Using SiteSpect

If you are implementing FullStory using a tool other than SiteSpect:

  1. In SiteSpect, open the Search & Replace area. In the Search Text field add </head>.
  2. In the Replacement Text field paste the script below.
<script>

window['_fs_ready'] = function() {
setUserAssignments();
};

let appliedSsVariations = "__SS_LISTVAR{__SS_TCID__:__SS_VGID__:__SS_VID__:__SS_VNAME__}{;}__";

let userCampaigns = "__SS_LISTCAMPAIGN{__SS_TCID__:__SS_TCNAME__:__SS_VGID__:__SS_VGNAME__}{;}__";

function sendFsEvent(assignmentString) {
var stringSplit = assignmentString.split(':');
var campaignID = stringSplit[0];
var variationGroupID = stringSplit[1];
var variationID = stringSplit[2];
var variationName = stringSplit[3];
var campaignName = "";
var variationGroupName = "";

if(campaignID !== "0"){
var campaignsSplit = userCampaigns.split(';');

for(let x = 0; campaignsSplit.length > x; x++){

var currentCampaign = campaignsSplit[x].replace(';', '');
var splitNames = currentCampaign.split(':');

if(campaignID === splitNames[0]){
campaignName = splitNames[1];

if(variationGroupID === splitNames[2]){
variationGroupName = splitNames[3];
}
}
}
}

FS.event('SiteSpect Variation Applied', {
campaignID: campaignID,
campaignName: campaignName,
variationGroupID: variationGroupID,
variationGroupName: variationGroupName,
variationID: variationID,
variationName: variationName
});
}

function setUserAssignments(){
if(appliedSsVariations !== "") {
var stringToSlice = appliedSsVariations;
var assignmentCount = (stringToSlice.match(new RegExp(";", "g")) || []).length + 1;

for (let x = 0; assignmentCount > x; x++) {

if (stringToSlice.indexOf(":") > -1) {
var indexOfSemicolon = stringToSlice.indexOf(";");

if (indexOfSemicolon > -1) {
var sliceOfAssignments = stringToSlice.slice(0, indexOfSemicolon + 1);

stringToSlice = stringToSlice.replace(sliceOfAssignments, '');

sliceOfAssignments = sliceOfAssignments.replace(';', '');

sendFsEvent(sliceOfAssignments);
} else {

sendFsEvent(stringToSlice);
}
}
}
}
}
</script>

</head>

How it Works

The appliedSsVariations variable is set by a WATTS macro that pulls together a list of all Variations applied on the page. SiteSpect adds both the variable and the WATTS data (including Campaign ID, Variation Group ID, Variation ID, and Variation name) to the page source. If there is no Campaign or Variation Group associated with the Variation, the ID is 0.

The userCampaigns variable is set by a WATTS macro that pulls together a list of all Campaigns the user is assigned to. (Note: This is a list of Campaigns the user is assigned to but not necessarily counted in.). The list from the macro contains the Campaign ID, Campaign Name, Variation Group ID, and Variation Group Name of all Campaigns the user is assigned to.

The function setUserAssignments iterates through each Variation applied to the page (Campaign and non-Campaign) that is listed in the appliedSsVariations variable and calls the sendFsEvent function.

The sendFsEvent function sends the Variation information to FullStory using their FS.event(). Prior to sending the Variation information, the function checks to see if there is a Campaign associated with the Variation and if so, it locates the the Campaign name and Variation Group name associated with the current Variation in the userCampaigns variable and adds it to the data before sending the Variation information to FullStory.