DocumentationMarketo EngageMarketo Guide

Callback Functions

May 1, 2024
  • Topics:
  • Dynamic Chat

You can use Dynamic Chat widget callback functions to send conversation events to any third-party platforms.

Getting Started

This event indicates the Dynamic Chat widget is ready for use and is fired when all scripts related to Dynamic Chat are loaded in the webpage.

window.addEventListener('adobedx.conversations.ready', () => {
    // code here will execute when chatbot scripts are loaded in a webpage
});

Conversation Events

These events are related to a conversation that is targeted on a specific page for a specific visitor.

Conversation Triggered

A conversation (e.g., a Dialogue) that is targeted for a website visitor is resolved and the chatbot is shown to them.

window.addEventListener('adobedx.conversations.ready', () => {
    const {addListener, Enum} = window.AdobeDX;
    addListener(Enum.Events.CONVERSATION_TRIGGERED, (event) => {
 // code here will execute when the chatbot is loaded for a visitor
    });
});

Conversation Engaged

Visitor engaged (e.g., provided their first response) with the chatbot.

window.addEventListener('adobedx.conversations.ready', () => {
    const {addListener, Enum} = window.AdobeDX;
    addListener(Enum.Events.CONVERSATION_ENGAGED, (event) => {
 // code here will execute when a visitor engages with the chatbot
     });
});

Conversation Completed

The visitor has reached the end of the conversation.

window.addEventListener('adobedx.conversations.ready', () => {
    const {addListener, Enum} = window.AdobeDX;
    addListener(Enum.Events.CONVERSATION_COMPLETED, (event) => {
 // code here will execute when a conversation is completed
     });
});

Conversation Closed

The visitor has closed the conversation before reaching the end.

window.addEventListener('adobedx.conversations.ready', () => {
    const {addListener, Enum} = window.AdobeDX;
    addListener(Enum.Events.CONVERSATION_CLOSED, (event) => {
 // code here will execute when a conversation is closed
    });
});

The event parameter is an object with metadata related to the conversation. You can access this metadata by accessing event.data.

Here are some key metadata values you can access:

Metadata
Attributes
Conversation name
payload.name
Conversation ID
payload.id
Conversation Type (dialogue/conversation flow)
payload.type
UI Type (popup/chatbot/inline)
payload.uiType
Session ID
payload.sid

Visitor Input Events

These events are triggered when a visitor engaging in a conversation provides their contact information (e.g., phone number or email address). Below are the events that fall under this category.

Phone Number

This event is triggered when a visitor provides their phone number during the conversation.

window.addEventListener('adobedx.conversations.ready', () => {
    const {addListener, Enum} = window.AdobeDX;
    addListener(Enum.Events.CONVERSATION_INPUT_PHONE, (event) => {
 // code here will execute when a visitor provides their phone number
    });
});

Email ID

This event is triggered when a visitor provides their email address during the conversation.

window.addEventListener('adobedx.conversations.ready', () => {
    const {addListener, Enum} = window.AdobeDX;
    addListener(Enum.Events.CONVERSATION_INPUT_EMAIL, (event) => {
 // code here will execute when a visitor provides their email address
    });
});

The event parameter is an object with metadata related to the conversation. You can access this metadata by accessing event.data.

Here are some key metadata values you can access:

Metadata
Attributes
Conversation name
payload.name
Conversation ID
payload.id
Conversation Type (dialogue/conversation flow)
payload.type
UI Type (popup/chatbot/inline)
payload.uiType
Session ID
payload.sid

Meeting Booking Events

These events are triggered when a visitor books a meeting with your business representative.

Below are the events that fall under this category.

Meeting Booked

This event is triggered when a visitor books a meeting on an agent’s calendar.

window.addEventListener('adobedx.conversations.ready', () => {
    const {addListener, Enum} = window.AdobeDX;
    addListener(Enum.Events.CONVERSATION_MEETING_BOOKED, (event) => {
 // code here will execute when a meeting is booked
    });
});

The event parameter is an object with metadata related to the conversation. You can access this metadata by accessing event.data.

Here are some key metadata values you can access:

Metadata
Attributes
Conversation name
payload.name
Conversation ID
payload.id
Conversation Type (dialogue/conversation flow)
payload.type
UI Type (popup/chatbot/inline)
payload.uiType
Session ID
payload.sid
Agent Name
payload.agentName
Agent ID
payload.agentID
Meeting Information
payload.meetingInfo

Live Chat Events

These events are triggered when a visitor connects with a live agent during their engagement with the chatbot.

Below are the events that fall under this category.

Live Chat Requested

This event is triggered when a visitor selects the option to chat with a live agent and an available agent is being resolved.

window.addEventListener('adobedx.conversations.ready', () => {
    const {addListener, Enum} = window.AdobeDX;
    addListener(Enum.Events.CONVERSATION_LIVE_CHAT_REQUESTED, (event) => {
 // code here will execute when a visitor requests a live chat
    });
});

Live Chat Initiated

This event is triggered when a visitor selects the option to chat with a live agent and an agent accepts the chat.

window.addEventListener('adobedx.conversations.ready', () => {
    const {addListener, Enum} = window.AdobeDX;
    addListener(Enum.Events.CONVERSATION_LIVE_CHAT_INITIATED, (event) => {
 // code here will execute after a live agent accepts the chat
    });
});

Live Chat Ended

This event is triggered when a conversation between a visitor and the live agent ends.

window.addEventListener('adobedx.conversations.ready', () => {
    const {addListener, Enum} = window.AdobeDX;
    addListener(Enum.Events.CONVERSATION_LIVE_CHAT_ENDED, (event) => {
 // code here will execute when a live chat is ended
    });
});

Live Chat Timeout

This event is triggered when a live chat conversation times out because the visitor stops responding, or they dropped.

window.addEventListener('adobedx.conversations.ready', () => {
    const {addListener, Enum} = window.AdobeDX;
    addListener(Enum.Events.CONVERSATION_LIVE_CHAT_REQUEST_TIMEOUT, (event) => {
 // code here will execute when a visitor abandons a live chat
    });
});

The event parameter is an object with metadata related to the conversation. You can access this metadata by accessing event.data.

Here are some key metadata values you can access:

Metadata
Attributes
Conversation name
payload.name
Conversation ID
payload.id
Conversation Type (dialogue/conversation flow)
payload.type
UI Type (popup/chatbot/inline)
payload.uiType
Session ID
payload.sid
Agent Name
payload.agentName
Agent ID
payload.agentID

If you wanted to send any of these events to an analytics platform like Adobe Analytics or Google Analytics, you would need to add their respective tracking call inside these Dynamic Chat events. It would look something like the example below.

window.addEventListener('adobedx.conversations.ready', () => {
    const {addListener, Enum} = window.AdobeDX;
    addListener(Enum.Events.CONVERSATION_TRIGGERED, (event) => {
 // Enter Adobe Analytics or Google Analytics function here
    ga('send', 'event', {
      eventCategory: Dynamic Chat Conversations',
      eventAction: 'Conversation Triggered',
      eventLabel: event.data.payload.id,
    });
    });
});
recommendation-more-help
94ec3174-1d6c-4f51-822d-5424bedeecac