Using Scheduled Interactions on your own Website – Talkative

⚠️

This guide is for developers. If you don’t have developer capacity, use Scheduled Interactions on the Talkative-hosted page instead.

🧭 What this covers

Set up Scheduled Interactions to run on your own website instead of the Talkative-hosted page. You’ll update your site to load the Scheduled Interactions bundle, point your Talkative config at your domain, and optionally add callbacks for better UX.

✅ Prerequisites

Access to edit your website’s codebase or tag manager

Your Talkative region: eu, us, or au

Your Scheduled Interactions Config UUID

Permission to update your company’s Scheduled Interactions URL in Talkative Admin[1]

1) Replace the standard Talkative script on your site

Remove the standard Talkative embed and load the Scheduled Interactions bundle instead:

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

REGION_HERE: your region code eu, us, or au

CONFIG_UUID_HERE: your config UUID, available from the import script on your Chat Widget page[1]

Tip: If using a tag manager, ensure the tag fires on pages that should support Scheduled Interactions.

2) Point Talkative to your website

In Talkative Admin, open your company’s Scheduled Interactions configuration and set the URL to your website, for example:

https://your-domain.example.com/book or your chosen path

Save your changes.

3) Test the end-to-end flow

From Engage, schedule an interaction

Follow the customer journey using your website URL

Confirm the session opens as expected on your site

🔁 Optional: Add callbacks for better UX

Add callbacks to inform customers when a session is waiting, cancelled, active, or ended. Talkative does not provide built-in UI for cancellations on your site, so you should surface this state yourself.[1]

TalkativeScheduledInteractions.init({
	region: 'REGION_HERE',
	configUuid: 'CONFIG_UUID_HERE',
	callbacks: {
		waiting:  () => { /* show waiting UI */ },
		cancelled: () => { /* show cancelled message */ },
		active:   () => { /* show in-call state */ },
		ended:    () => { /* show follow-up / thank you */ }
	}
});

We recommend handling at least waiting, cancelled, and ended.

⚙️ Advanced: Override URL parameter behaviour

By default, the SDK reads the scheduled interaction ID from talkative-scheduled-uuid in the current page URL:

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

If you need a different parameter name or a custom retrieval approach, provide your own function via scheduledIdRetrievalOverride when calling init.

🤝 Calendly integration

If you use Calendly, no extra changes are required. Customers who click the link will be redirected to the right page automatically, as long as you’ve followed the steps above.

🧪 Troubleshooting

Nothing happens on your site: confirm the standard Talkative script was removed and the Scheduled Interactions bundle is loading without errors

Session not found: verify your URL is correctly set in the Scheduled Interactions config and that your site is accessible publicly

Region or UUID errors: double-check region and configUuid values

Cancelled sessions still look active: implement the cancelled callback and show a clear message