Pendo Event Tracking | Blue Frog Docs

Pendo Event Tracking

Track events and user behavior in Pendo.

Event Tracking Overview

Pendo provides two complementary approaches to event tracking: automatic capture and custom track events. The platform automatically captures clicks, page views, and form interactions without any code, while also allowing you to track custom events programmatically for actions that require specific business logic or server-side tracking.

Auto-Capture Events

Pendo automatically tracks user interactions without requiring code:

What's Auto-Captured

  • Page Views: All page loads and navigation
  • Clicks: All click events on interactive elements
  • Form Interactions: Form field focus and submissions
  • Text Selection: Text highlighting and copying
  • Hover Events: Mouse hover over elements (optional)
  • Video Interactions: Play, pause, and completion (with configuration)

Configuring Auto-Capture

// Disable auto-capture for specific elements
pendo.initialize({
  apiKey: 'YOUR_API_KEY',
  visitor: {
    id: 'user-123'
  },
  excludedElements: [
    // Exclude elements by class
    '.sensitive-data',
    // Exclude by ID
    '#password-field',
    // Exclude by attribute
    '[data-pendo-ignore]'
  ]
});

Custom Track Events

Track specific business events and user actions programmatically:

Basic Event Tracking

// Simple event
pendo.track('Event Name');

// Event with properties
pendo.track('Feature Used', {
  feature: 'Export',
  format: 'CSV',
  rows: 1500
});

// Event with timestamp
pendo.track('Custom Action', {
  timestamp: Date.now(),
  action: 'download'
});

Common Track Event Patterns

Product Events:

// Feature usage
pendo.track('Feature Used', {
  feature: 'Advanced Search',
  filters_applied: 3,
  results_count: 42
});

// Export functionality
pendo.track('Data Export', {
  format: 'CSV',
  record_count: 1500,
  export_type: 'filtered'
});

// Integration usage
pendo.track('Integration Connected', {
  integration: 'Salesforce',
  connection_type: 'OAuth',
  sync_direction: 'bidirectional'
});

Onboarding Events:

// Onboarding progress
pendo.track('Onboarding Step Completed', {
  step: 3,
  step_name: 'Profile Setup',
  time_spent: 45, // seconds
  skipped: false
});

// Tutorial completion
pendo.track('Tutorial Completed', {
  tutorial_id: 'getting-started',
  completion_rate: 100,
  time_to_complete: 180
});

// Activation milestone
pendo.track('Activation Milestone', {
  milestone: 'First Project Created',
  days_since_signup: 2
});

Subscription Events:

// Upgrade initiated
pendo.track('Upgrade Started', {
  from_plan: 'Starter',
  to_plan: 'Pro',
  billing_cycle: 'annual',
  source: 'feature_limit'
});

// Trial conversion
pendo.track('Trial Converted', {
  trial_length: 14,
  plan: 'Business',
  payment_method: 'credit_card'
});

// Downgrade
pendo.track('Plan Downgraded', {
  from_plan: 'Enterprise',
  to_plan: 'Pro',
  reason: 'team_size_reduction'
});

Engagement Events:

// Content creation
pendo.track('Content Created', {
  content_type: 'report',
  template_used: true,
  sharing_enabled: true
});

// Collaboration
pendo.track('User Invited', {
  role: 'editor',
  invitation_method: 'email',
  team_size_after: 8
});

// Resource access
pendo.track('Help Resource Accessed', {
  resource_type: 'video',
  resource_id: 'advanced-filtering',
  source: 'in-app-tooltip'
});

Visual Feature Tagging

Pendo's Designer allows you to tag features without writing code:

Using the Visual Designer

  1. Access Designer: Click the Pendo icon and select "Designer"
  2. Select Element: Click on the feature/element to tag
  3. Name Feature: Give it a descriptive, consistent name
  4. Configure Rules: Set targeting rules if needed
  5. Save and Publish: Feature is now tracked automatically

Feature Tagging Best Practices

Naming Conventions:

// Good feature names
"Dashboard > Export Button"
"Settings > Billing Tab"
"Editor > Save Draft Button"

// Poor feature names
"Button 1"
"div.class-name"
"Thing in header"

Hierarchical Structure:

Area > Section > Feature
"Reports > Filters > Date Range Selector"
"Profile > Settings > Notification Preferences"
"Inbox > Message List > Archive Button"

Server-Side Event Tracking

Track events from your backend using the Pendo Track API:

// Node.js example
const axios = require('axios');

async function trackServerEvent(visitorId, eventName, properties) {
  await axios.post('https://app.pendo.io/data/track', {
    event: eventName,
    visitorId: visitorId,
    accountId: 'account-123',
    timestamp: Date.now(),
    properties: properties
  }, {
    headers: {
      'X-Pendo-Integration-Key': 'YOUR_INTEGRATION_KEY',
      'Content-Type': 'application/json'
    }
  });
}

// Track server-side event
trackServerEvent('user-456', 'API Call Made', {
  endpoint: '/api/v2/users',
  method: 'POST',
  response_time: 245,
  status_code: 201
});

Event Properties and Metadata

Add rich context to events for better segmentation:

Property Types

pendo.track('Purchase Completed', {
  // String properties
  product_name: 'Enterprise Plan',
  payment_method: 'credit_card',

  // Numeric properties
  amount: 999.00,
  quantity: 1,
  discount_percent: 10,

  // Boolean properties
  is_renewal: false,
  auto_renew_enabled: true,

  // Array properties
  features_included: ['SSO', 'API Access', 'Priority Support'],

  // Nested objects
  billing_info: {
    country: 'US',
    state: 'CA',
    currency: 'USD'
  },

  // Timestamp
  purchase_date: new Date().toISOString()
});

Event Naming Best Practices

Use Past Tense:

// Good
pendo.track('Report Generated');
pendo.track('User Invited');

// Avoid
pendo.track('Generate Report');
pendo.track('Invite User');

Be Specific and Descriptive:

// Good
pendo.track('CSV Export Completed', { rows: 1000 });
pendo.track('Pro Plan Upgrade Started');

// Too vague
pendo.track('Export');
pendo.track('Upgrade');

Use Consistent Naming:

// Consistent pattern
pendo.track('Feature Enabled', { feature: 'Two-Factor Auth' });
pendo.track('Feature Disabled', { feature: 'Email Notifications' });

// Inconsistent
pendo.track('Enabled 2FA');
pendo.track('Turned Off Notifications');

Tracking User Properties

Update user metadata alongside events:

// Update visitor properties
pendo.identify({
  visitor: {
    id: 'user-123',
    email: 'user@example.com',
    full_name: 'Jane Doe',
    role: 'Admin',
    plan_type: 'Enterprise',
    trial_end_date: '2024-12-31',
    last_login: new Date().toISOString()
  },
  account: {
    id: 'account-456',
    name: 'Acme Corp',
    plan: 'Enterprise',
    mrr: 999,
    employee_count: 150,
    industry: 'Technology'
  }
});

// Then track event
pendo.track('Settings Updated', {
  setting_category: 'security',
  changes_made: 3
});

Event Validation and Testing

Verify events are tracking correctly:

Using Browser Console

// Enable Pendo debug mode
localStorage.setItem('pendo_debug', 'true');
location.reload();

// Check if Pendo is loaded
console.log(typeof pendo); // Should output 'object'

// Manually trigger test event
pendo.track('Test Event', { test: true });

// View recent events
pendo.getEventCache();

Testing Checklist

  • Event fires at the correct time
  • Event name follows naming convention
  • All required properties are included
  • Property values are correct data types
  • Event appears in Pendo debugger
  • Event visible in Pendo Data Explorer within 5 minutes
  • Event can be used in segments and reports

Event Volume Considerations

Best Practices for High-Volume Applications

// Debounce frequent events
let searchTimeout;
function trackSearch(query) {
  clearTimeout(searchTimeout);
  searchTimeout = setTimeout(() => {
    pendo.track('Search Performed', {
      query: query,
      results_count: getResultsCount()
    });
  }, 1000); // Wait for user to stop typing
}

// Sample high-frequency events
const shouldTrack = Math.random() < 0.1; // Track 10% of events
if (shouldTrack) {
  pendo.track('Scroll Event', { depth: scrollDepth });
}

// Batch related events
const actions = [];
function trackBatchAction(action) {
  actions.push(action);

  if (actions.length >= 10) {
    pendo.track('Batch Actions Completed', {
      actions: actions,
      count: actions.length
    });
    actions.length = 0; // Clear array
  }
}

Common Event Tracking Patterns

Form Interactions

// Form started
pendo.track('Form Started', {
  form_name: 'Contact Sales',
  form_location: 'pricing_page'
});

// Form field completed
pendo.track('Form Field Completed', {
  form_name: 'Contact Sales',
  field_name: 'company_size',
  field_value: '51-200'
});

// Form submitted
pendo.track('Form Submitted', {
  form_name: 'Contact Sales',
  time_to_complete: 45,
  fields_completed: 8
});

Error Tracking

// Application error
pendo.track('Error Occurred', {
  error_type: 'validation',
  error_message: 'Invalid email format',
  error_location: 'signup_form',
  user_action: 'form_submission'
});

// API error
pendo.track('API Error', {
  endpoint: '/api/users',
  status_code: 500,
  error_message: 'Internal server error',
  retry_attempted: true
});

Analytics and Reporting

Once events are tracked, use them in Pendo:

  • Segments: Create user segments based on event completion
  • Funnels: Build funnels with custom events as steps
  • Reports: Analyze event trends over time
  • Guides: Trigger guides based on event occurrence
  • Dashboards: Add event metrics to custom dashboards

 

 

Related Resources:

↑ Back to top
// SYS.FOOTER