Before we begin: This tutorial should be followed by a developer. We recommend using scheduled interactions on the talkative website unless sufficient time can be put into implementing this feature.

import('https://talkative-cdn.com/scheduled-interaction-loader/0.0.1/scheduledInteractionLoader.js')
.then(({TalkativeScheduledInteractions}) => TalkativeScheduledInteractions.init({region: 'REGION_HERE',
          configUuid: 'CONFIG_UUID_HERE'}))

You will need to replace REGION_HERE with your region (eu,us,au) and CONFIG_UUID_HERE with your config UUID (this is available as part of the import script on the chat widget page).

Changes to Talkative

You will need to edit the talkative company config for Scheduled Interactions and change the URL to be https://your-website-here/path-to-your-scheduled-page?talkative-scheduled-uuid=%scheduledInteractionUuid%

Once the above changes are done, your website should be able to handle scheduled interactions from engage. Test this by scheduling an interaction and following the flow as intended.

Calendly Integration

If you are using Calendly, you do not need to make any changes. Talkative will automatically redirect users clicking the link to the correct page, provided the instructions on this page have been followed correctly.

Callbacks (STRONGLY RECOMMENDED)

Callbacks will improve the users experience depending on if the user is waiting for an interaction or it has been cancelled. Talkative does not provide UI to notify the user that the scheduled call they are going on has been cancelled. This is up to you to provide.

In order to configure callbacks, use the following syntax

  TalkativeScheduledInteractions.init({
          region: 'REGION_HERE',
          configUuid: 'CONFIG_UUID_HERE'
          callbacks: {
            cancelled: () => {
              console.log('cancelled');
            },
            waiting: () => {
              console.log('waiting');
            },
            active: () => {
              console.log('active');
            },
            ended: () => {
              console.log('ended');
            },
          }
        })
      })();

We recommend handling at least waiting, cancelled and ended.

Overriding behaviours

Providing a sessionId (as a string) will scope your configs under a different session ID. We do not recommend this.

If you want to format your URL differently (rename the parameter, you can provide a paramter called scheduledIdRetrievalOverride to the init function. The default one is:

    scheduledIdRetrieval: () => new URL(window.location.href).searchParams.get('talkative-scheduled-uuid'),

it needs to return the sched