Skip to Content
🔌 IntegrationsCustom JavaScript Events

Custom Events

An embedded HowdyGo demo sends events to its parent page as the viewer moves through it. Use these events to update your page or connect your own analytics. For server-side delivery, use webhooks. For GA4 or Google Tag Manager, you can enable the Tracking Script’s event bridge.

Setup

Add a message listener to the page containing your demo. Use the origin of your demo iframe; change demoOrigin if you use a custom domain.

const demoOrigin = "https://app.howdygo.com"; window.addEventListener("message", (event) => { if (event.origin !== demoOrigin) return; if (event.data?.message !== "howdygo-demo-event") return; const payload = event.data.payload; if (!payload || typeof payload.eventName !== "string") return; const { eventName, email, properties } = payload; console.log("Demo event:", eventName, properties); if (eventName === "howdygo_player_end") { console.log("Demo completed by:", email ?? "an unidentified viewer"); } });

The listener receives this message shape:

{ "message": "howdygo-demo-event", "payload": { "eventName": "howdygo_demo_engagement", "email": "jane@example.com", "properties": { "demo_id": "your-demo-id", "demo_title": "Product tour", "demo_url": "https://app.howdygo.com/embed/your-demo-id", "demo_session_id": "viewing-session-id" } } }

For demos opened through howdygo.openModal(), the SDK also exposes a demo-event listener.

Common properties

PropertyTypeDescription
demo_idstringID of the demo.
demo_titlestringTitle of the demo.
demo_urlstringURL of the demo player, including any query parameters.
demo_session_idstringID shared by events from the same viewing session.
collection_idstring, optionalCollection containing the demo, when supplied by the event.

Viewer identity

payload.email is optional and sits alongside eventName and properties. It contains the resolved viewer email when one is available and the demo’s owning organization allows viewer identification. Current player callbacks use email; they do not send the older top-level userId field.

The callback does not include externalUserId. An external user ID alone does not produce an email. The SDK’s GA4 bridge forwards properties without copying top-level email into dataLayer.

If your app supplies identity after the demo has opened, later events use the updated values. Identification does not create an extra demo event, resend earlier events, or change demo_session_id. See SDK identity precedence for how SDK calls, forms, personalization, and URL parameters are combined.

Events

Session start

howdygo_session_start is sent when the viewer starts a demo session. It includes the common properties.

Step Viewed

howdygo_step_viewed is sent when a demo step is shown. It adds:

PropertyTypeDescription
step_idstringID of the step.
step_indexnumberZero-based step index: the first step is 0.

The analytics index is zero-based. The SDK’s goToStep() method uses one-based indices.

Demo Engagement

howdygo_demo_engagement is sent when the viewer reaches the second step. It includes the common properties.

CTA Click

howdygo_cta_click is sent when the viewer clicks a call to action. It adds:

PropertyTypeDescription
cta_idstringID of the call to action.
cta_urlstring, optionalDestination URL, when the action has one.

Player end

howdygo_player_end is sent when the viewer reaches the end of the demo. It includes the common properties.

Last updated on