This guide focuses on capturing the URL from Fullstory and adding it to the Tealium Data Layer (UDO). The key challenge is that the Fullstory session URL is not available until after the Fullstory script has fully initialized and started a session, which can create a race condition with Tealium's tags.
The best practice is to use a Pre Loader extension in Tealium to define the official _fs_ready callback. This ensures that as soon as Fullstory is ready, it populates the Tealium Data Layer, making the URL available for all subsequent tracking calls.
Prerequisites
Prerequisites:
- Fullstory: The Fullstory data capture snippet is already implemented on your website.
- Tealium iQ: You have access to your Tealium iQ profile and it is implemented on the same site.
- AEP Tag: You have the Adobe Experience Platform Web SDK tag added to your Tealium iQ profile. (see Alternate Configuration if AEP is not in scope)
Step 1: Create a JavaScript Extension in Tealium iQ
This extension will set up a listener. When the Fullstory script is ready, it will grab the session URL and push it directly into the utag.data object.
- Navigate to iQ Tag Management in your Tealium profile.
- Go to the Extensions tab.
- Click + Add Extension .
- Select the JavaScript Code extension.
- Give the extension a descriptive Title , such as "Set Fullstory Session URL".
- In the Scope dropdown, select After Load Rules . This is critical as it ensures your listener is set up before any tags (including AEP) fire.
Note: Use the After Load Rules scope to ensure your listener is set up before any tags fire. This prevents race conditions where tags attempt to access the Fullstory session URL before it's available.
In the code editor, paste the following JavaScript:
// Ensure the utag data object exists
window.utag = window.utag || {};
window.utag.data = window.utag.data || {};
// Use Fullstory's official _fs_ready callback
// This function will execute as soon as Fullstory is initialized and a session is active
try {
var fsURL = null;
// Check for the modern V2 API first
if (typeof window.FS === 'function' && typeof window.FS.getSession === 'function') {
fsURL = window.FS('getSession', { format: 'url' });
}
// Fallback to the legacy V1 API
else if (window.FS && typeof window.FS.getCurrentSessionURL === 'function') {
fsURL = window.FS.getCurrentSessionURL();
}
// If we successfully got the URL, add it to the UDO
if (fsURL) {
window.utag.data.fullstory_session_url = fsURL;
}
} catch (e) {
// Optional: log an error to the console for debugging
console.log("Tealium <Fullstory> Extension Error: " + e);
}
- Click Save .
Step 2: Add the Variable to Your Data Layer
Now that the extension is populating utag.data.fullstory_session_url , you must officially define this variable in Tealium's Data Layer so it can be used by tags.
- Go to the Data Layer tab in Tealium iQ.
- Click + Add Variable .
- In the Source field, enter the exact name you used in the JavaScript extension:
fullstory_session_url. - In the Type dropdown, select UDO Variable .
- Give it a user-friendly Alias (e.g., Fullstory Session URL).
- Click Apply .
Step 3: Map the Variable to Adobe Experience Platform (AEP)
With the variable in the Tealium Data Layer, you can now map it to your AEP tag to send to the Experience Platform.
- Under the iQ Tag Management menu click on the Tags tab.
- Find and click on your Adobe Experience Platform Web SDK tag to edit its configuration.
- Click on the Mapped Variables tab.
- Find the Mapped Variables dropdown and search for Fullstory Session URL (or whatever alias you created).
- Click the Add Mapping button, and you need to map your Fullstory Session URL to your desired XDM field. You will need to:
- Select Custom Destination and enter the full XDM path for the field you created in AEP to store this URL.
-
Example XDM Path:
_yourtenantid.fullstorySessionUrlorweb.webPageDetails.sessionReplayUrl(depending on your specific XDM schema). - Click Done .
- Click Apply.
Step 4: Save, Publish, and Validate
- In the top right corner click Save/Publish to save your changes in Tealium iQ.
- Publish your work to your development or QA environment.
-
Validate your work:
-
Check the Data Layer: Open your website in a browser with the developer console. After the page loads, type
utag.data.fullstory_session_urland press Enter. You should see the Fullstory session URL returned as a string. - Check the AEP Beacon: Use the Adobe Experience Platform Debugger browser extension. Load your page and look at the "Network" events for the AEP Web SDK. Inspect the payload (the events array) to find your XDM field and verify it contains the Fullstory URL.
-
Check the Data Layer: Open your website in a browser with the developer console. After the page loads, type
Alternate Configuration
If you're not using Adobe Experience Platform (AEP), you can still capture the Fullstory session URL for use with Adobe Analytics or other analytics platforms.
Fullstory Replay URL for Adobe Analytics
The following function can be called to fetch the session replay URL from the Fullstory Browser SDK and then assign that value to the appropriate data element / eVar in Adobe data layer.
function setFullStoryReplayUrl(eVarName) {
/* Check if the FullStory global object exists and session URL function is available */
if (window.FS && typeof window.FS.getCurrentSessionURL === 'function') {
/* Use the synchronous method. Pass 'true' to get the URL at the current moment in time.
Omit 'true' or use FS.getCurrentSessionURL() for a link to the beginning of the session. */
var fullStoryUrl = window.FS.getCurrentSessionURL(true);
// Check if the URL was successfully retrieved
if (fullStoryUrl) {
// Set the Adobe Analytics eVar (e.g., s.eVar10)
// Ensure 's' object is defined by your AppMeasurement implementation
if (window.s) {
window.s[eVarName] = fullStoryUrl;
// console.log('Adobe Analytics ' + eVarName + ' set to: ' + fullStoryUrl);
} else {
console.error('Adobe Analytics s object not found.');
}
} else {
console.log('FullStory session URL is not yet available synchronously.');
// --- Fallback/Alternative using FS('observe') or window['_fs_ready'] ---
// If synchronous fails, you may use an asynchronous approach for a later beacon.
// For a page load beacon (s.t()), the synchronous method is typically required
// if you don't delay the beacon. For custom link tracking (s.tl()),
// you can often use a callback/promise approach.
// Example of using the readiness check (if your FullStory implementation uses it)
if (window['_fs_ready']) {
window['_fs_ready'](function() {
var asyncFullStoryUrl = FS.getCurrentSessionURL(true);
if (asyncFullStoryUrl && window.s) {
// This can set the eVar for a subsequent event/beacon
window.s[eVarName] = asyncFullStoryUrl;
console.log('Adobe Analytics ' + eVarName + ' set asynchronously: ' +
asyncFullStoryUrl);
// If this is *not* a page view, you'd fire s.tl() here
// e.g., s.tl(this, 'o', 'FullStory Ready Link');
}
});
}
}
} else {
console.warn('FullStory object (window.FS) or getCurrentSessionURL function not found.');
}
}
Implementation Call Examples
-
For a Page View (
s.t())Call the function before your
s.t()call on page load:// Note: Replace eVarX with your actual eVar, e.g., 'eVar10' setFullStoryReplayUrl('eVarX'); s.t(); -
For a Custom Link/Event (
s.tl())You can integrate this into your event handler:
document.getElementById('myButton').addEventListener('click', function() { setFullStoryReplayUrl('eVarX'); if (window.s && window.s.eVarX) { // Ensure you also set the necessary linkTrackVars for s.tl() s.linkTrackVars = s.linkTrackVars ? s.linkTrackVars + ',eVarX' : 'eVarX'; s.tl(this, 'o', 'Button Click with FS URL'); } }); -
Explicitly run for
eVar30(synchronously, usually placed befores.t())setFullStoryReplayUrl('eVar30');