🔌 Integrations
Custom Events

Custom Events

In pages where you've embedded a HowdyGo demo, it's possible to pick up events from the demo. This allows you to customize event handling as per your own requirements.

Setup

  1. Add an event listener to your page and identify the howdygo-demo-event message:
window.addEventListener('message', function (event) {
  try {
    if (event.data.message === 'howdygo-demo-event') {
      const payload = event.data.payload;
 
      // Handle the custom event here
    }
  } catch (error) {
    console.error({ error });
  }
});
  1. Within the condition for the howdygo-demo-event message, you can access the payload which contains details about the event. For instance:
const eventName = payload.eventName;
const properties = payload.properties;
  1. Based on the event name and properties, you can customize your JavaScript actions:
// To log the event in the console
console.log(`Received event: ${eventName} with properties:`, { properties });
 
// To log the event on your own analytics system
myCustomAnalytics.sendEvent(eventName, properties);ƒ

Events

Session start

When a prospect starts a session

{
  "eventName": "howdygo_session_start",
  "properties": {
    "demo_id": {
      "type": "string",
      "format": "uuid"
    },
    "demo_title": {
      "type": "string"
    },
    "demo_url": {
      "type": "string",
      "format": "uuid"
    }
  }
}

Step Viewed

When a prospect views a step of a demo

{
  "eventName": "howdygo_step_viewed",
  "properties": {
    "demo_id": {
      "type": "string",
      "format": "uuid"
    },
    "demo_title": {
      "type": "string"
    },
    "demo_url": {
      "type": "string",
      "format": "uuid"
    },
    "step_id": {
      "type": "string",
      "format": "uuid"
    },
    "step_index": {
      "type": "number"
    }
  }
}

Demo Engagement

When a prospect engages with a demo (clicks next on the first step)

{
  "eventName": "howdygo_demo_engagement",
  "properties": {
    "demo_id": {
      "type": "string",
      "format": "uuid"
    },
    "demo_title": {
      "type": "string"
    },
    "demo_url": {
      "type": "string",
      "format": "uuid"
    }
  }
}

CTA Click

When a prospect clicks on a call to action

{
  "eventName": "howdygo_cta_click",
  "properties": {
    "demo_id": {
      "type": "string",
      "format": "uuid"
    },
    "demo_title": {
      "type": "string"
    },
    "demo_url": {
      "type": "string",
      "format": "uuid"
    },
    "cta_id": {
      "type": "string",
      "format": "uuid"
    },
    "cta_url": {
      "type": "string",
      "format": "uuid"
    }
  }
}

Player end

When a prospect completes a demo

{
  "eventName": "howdygo_player_end",
  "properties": {
    "demo_id": {
      "type": "string",
      "format": "uuid"
    },
    "demo_title": {
      "type": "string"
    },
    "demo_url": {
      "type": "string",
      "format": "uuid"
    }
  }
}
GitBookSSO