Documentation Index
Fetch the complete documentation index at: https://vida.io/docs/llms.txt
Use this file to discover all available pages before exploring further.
To set up Pendo tracking inside the Vida iframe, you need to add telemetry scripts. The scripts you define will automatically be injected into the app once they are set up. We strongly recommend implementing on staging first, then copying to the production version of your reseller account.
Base Script
This script loads at the base of the Vida single page app (SPA). Replace YOUR_PENDO_KEY with your unique Pendo key.
Pendo Example
(function(apiKey){
(function(p,e,n,d,o){var v,w,x,y,z;o=p[d]=p[d]||{};o._q=o._q||[];
v=['initialize','identify','updateOptions','pageLoad','track'];for(w=0,x=v.length;w<x;++w)(function(m){
o[m]=o[m]||function(){o._q[m===v[0]?'unshift':'push']([m].concat([].slice.call(arguments,0)));};})(v[w]);
y=e.createElement(n);y.async=!0;y.src='https://cdn.pendo.io/agent/static/'+apiKey+'/pendo.js';
z=e.getElementsByTagName(n)[0];z.parentNode.insertBefore(y,z);})(window,document,'script','pendo');
})(YOUR_PENDO_KEY);
User Identification Script
This script runs when the user and account are loaded. It includes the traits argument, which provides data about the user and the account. Use traits.user.externalUserId and traits.account.externalAccountId to match the user and account to your internal analytics. Before the user can be identified, you must first call pendo.initialize() with the argument visitor.id set to traits.user.externalAccountIdd. See below for an example.
Arguments
traits - object of attributes for the user and the account
{
user: {
username: "sampleUser", // Unique login name
id: 42, // Internal numeric user ID
email: "sample.user@example.com", // Contact email
name: "Sample User", // Full display name
firstName: "Sample", // Given name
lastName: "User", // Family name
active: true, // Whether the user account is active
disableDetails: "Disabled due to demo rules.", // Optional reason if inactive
srcIP: "203.0.113.42", // IP address of last request
organizationId: 99, // Owning organization’s ID
partnerId: 1001, // Partner identifier
resellerId: 555777, // Reseller identifier
tempUser: false, // Flag for temporary/guest accounts
phoneNumberVerified: "+1-800-555-0101", // Verified phone number
pushEnabled: true // Whether push notifications are enabled
},
account: {
accountType: "organization", // "organization" or other account scope
username: "sampleOrg", // Org-level username (often same as user)
id: 99, // Unique account ID
timestamp: 1700000000000, // Unix ms timestamp when traits generated
active: true, // Whether the account is active
orgName: "Example Corp.", // Organization display name
partnerId: 1001, // Partner identifier (mirrors user.partnerId)
resellerId: 555777, // Reseller identifier (mirrors user.resellerId)
vidaPremium: true, // Subscription flag
vidaPhoneNumber: "+1-800-555-0202",// Support/organization phone number
vidaPremiumTimestamp: "1700000000",// Unix seconds when premium purchased
vidaPremiumExpires: "1710000000", // Unix seconds when premium expires
vidaPremiumCanceled: null, // Unix seconds of cancellation, null if active
productPlanId: "pplan-demo-123", // Product plan identifier
productPlanTerm: null, // Term details (e.g., "monthly"), null if N/A
productPlanOffer: false, // Whether plan was part of a promo
smsEnabled: true, // SMS notification availability
canceledReason: null, // Cancellation reason if canceled
canceledDetails: null, // Additional cancellation notes
externalAccountId: null, // Optional external account reference
externalBillingId: "cus_123456789",// Billing platform customer ID
billingSubscriptionId: null // External subscription ID, if applicable
},
userAgentData:
"Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/114.0.0.0 Safari/537.36" // Browser user-agent string
}
Example
if (typeof window !== 'undefined' && window.pendo) {
pendo.initialize({
visitor: {
id: String(traits.account.externalAccountId || traits.account.id)
}
});
window.pendo.identify({
"account": {
"id": String(traits.account.externalAccountId || traits.account.id),
"vida_organizationId": traits.account.id,
"vida_username": traits.account.username,
"vida_createDate": traits.account.timestamp,
"vida_active": traits.account.active,
"vida_signupIp": traits.account.signupIp,
"vida_premium": traits.account.vidaPremium,
"vida_premiumTimestamp": traits.account.vidaPremiumTimestamp,
"vida_premiumExpires": traits.account.vidaPremiumTimestamp,
"vida_premiumCanceled": traits.account.vidaPremiumCanceled,
"vida_productPlanId": traits.account.productPlanId,
"vida_productPlanTerm": traits.account.productPlanTerm,
"vida_productPlanOffer": traits.account.productPlanOffer,
"vida_smsEnabled": traits.account.smsEnabled,
"vida_canceledReason": traits.account.canceledReason,
"vida_canceledDetails": traits.account.canceledDetails,
},
"visitor": {
"id": String(traits.user.externalUserId || traits.user.id),
"email": traits.user.email,
"vida_id": traits.user.id,
"vida_username": traits.user.username,
"vida_active": traits.user.active,
"vida_disableDetails": traits.user.disableDetails,
"vida_srcIP": traits.user.srcIP,
"vida_organizationId": traits.user.organizationId,
"vida_pushEnabled": traits.user.pushEnabled,
}
});
}
Page View Tracking Script
Tag a page load. It is best to use window.location.href to pass which page is loaded.
if (typeof window !== 'undefined' && window.pendo) {
window.pendo.pageLoad(window.location.href);
}
Event View Tracking Script
Tag predefined tracking events such as clicks, modal views, or form submissions in Vida. We recommend prepending the event with Vida so you can more easily document which events are coming from the Vida iframe.
Arguments
event - string representing the name of the event
props - object of attributes unique to this event
Example
if (typeof window !== 'undefined' && window.pendo) {
window.pendo.track(`Vida - ${event}`, props);
}