Add campaigns

These Contact Center SDK docs are for developers who may not be Contact Center users or admins. To learn to configure campaigns, use flows, and other admin tasks, go to Zoom's user support docs.

Contact Center provides methods such as open(), close(), hide(), or show() to give better control of web chat window behavior, resulting in a more adaptable website experience. For example, you might want to use Javascript or specific user interactions with the site to trigger the visibility of the bot.

Learn specific ways you can use the Contact Center SDK for web and see the SDK reference for events and methods.

Contact Center web SDK functionality

Use the Contact Center SDK for web to manage your web chat window.

This SDK script loads when the page loads. However, the SDK won't fully load until the allocation of resources. As a result, before we execute any SDK functions, Zoom provides the zoomCampaignSdk:ready check.

We strongly recommend you include this check to avoid an undefined error in the console, and ensure the proper execution of the bot.

window.addEventListener("zoomCampaignSdk:ready", () => {
    // customer can do something here:
    // ...
    // eg. using it to open campaign
    zoomCampaignSdk.open();
});

SDK capabilities

Use Contact Center SDK for web to perform specific tasks, such as open, close, or send a message.

enum Events{
    OPEN:"open";
    CLOSE:"close";
    SHOW:"show";
    HIDE:"hide";
    SEND_MESSAGE:"send_message";
}
zoomCampaignSdk:{
    open(): void;
    close(): void;
    show(): void;
    hide(): void;
    endChat(): void;
    on(eventName:"string",handler:any): void;
    off(eventName:"string",handler?:any): void;
}

After window.zoomCampaignSdk:ready completes, developers can write code to refer to events or SDK methods mentioned above.

window.addEventListener("zoomCampaignSdk:ready", () => {
    window.zoomCampaignSdk.open();
});

Explicit SDK interactions with Contact Center

Use the Contact Center SDK for web to explicitly interact with the Contact Center to perform such actions as open, close, or hide a Contact Center modal.

if (window.zoomCampaignSdk) {
    // To open the Contact Center modal and start a new conversation if one has not started
    window.zoomCampaignSdk.open();
    //To hide the Contact Center modal, including the invitation
    window.zoomCampaignSdk.hide();
    //To show the Contact Center modal, including the launcher widget
    window.zoomCampaignSdk.show();
    // To close or collapse the modal so that only the launcher widget is visible
    window.zoomCampaignSdk.close();
    // To end engagement, keep the Contact Center modal as it is
    window.zoomCampaignSdk.endChat();
}

Handling events in Contact Center SDK for web

Use the Contact Center SDK for web to handle events, such as unsubscribing from one or all callbacks from an event.

if (window.zoomCampaignSdk) {
    //To add a callback function to execute after a specific event is emitted
    window.zoomCampaignSdk.on(event, callback);
    //To unsubscribe a callback from an event
    window.zoomCampaignSdk.off(event, callback);
    //To unsubscribe all callbacks from an event
    window.zoomCampaignSdk.off(event);
}

Event examples

Contact Center SDK for web performs actions, such as open, close, or send messages.

if (window.zoomCampaignSdk) {
    window.zoomCampaignSdk.on("open", () => {
        alert("open event");
    });
}
if (window.zoomCampaignSdk) {
    window.zoomCampaignSdk.on("close", () => {
        alert("close event");
    });
}
if (window.zoomCampaignSdk) {
    window.zoomCampaignSdk.on("show", () => {
        alert("show event");
    });
}
if (window.zoomCampaignSdk) {
    window.zoomCampaignSdk.on("hide", () => {
        alert("hide event");
    });
}
if (window.zoomCampaignSdk) {
    window.zoomCampaignSdk.on("send_message", () => {
        alert("send_message event");
    });
}