Use the following example to learn how to differentiate between distinct flows via the AMAZD code snippet.

The AMAZD site tag should appear immediately after the opening HTML tag of each page on your website. Your AMAZD will not function properly unless a site tag occurs on a certain page. If you only want the widget to appear on select pages, you can include it directly after the beginning of the body> HTML tag. We recommend using a Tag Manager for complex integrations.

‍

There are multiple ways to display the widget. A quick summary can be found here:
211006_AMAZD_Technical Onboarding.png

1. Expert flow

In order to integrate the expert flow adjust the following code snippet to your company. The easiest integration is done by exchanging the company handle only.

<script>
window.amazdSettings = {
"company": "COMPANY HANDLE"
};
(function (d, s) { var e = d.createElement(s), t = d.getElementsByTagName(s)[0]; e.async = true; e.src = 'https://widget.amazd.co/widget.js'; t.parentNode.insertBefore(e, t);})(document, 'script');
</script>

2. Maximize the Snippet automatically

It is possible to open the widget automatically, once the website is being opened. We recommend this in combination with specific triggers (e.g. a after x seconds or a device type). If you want to use the snippet without a Tag Manager, please do not integrate this in the header of your website. It will be impossible to surf your website on mobile devices. Without using the triggers of a Tag Manager, choose specific pages to display this snippet only.

<script>
window.amazdSettings = {
company": "COMPANY HANDLE"
"maximize": true
};
(function (d, s) { var e = d.createElement(s), t = d.getElementsByTagName(s)[0]; e.async = true; e.src = 'https://widget.amazd.co/widget.js'; t.parentNode.insertBefore(e, t);})(document, 'script');
</script>

3. Deflection Flow

The deflection flow integrates the possibility to guide your customers with customer service related questions to a specific landing page or eMail address. In this flow, customers cannot choose their experts from a list and are linked with a specific expert.

<script>
window.amazdSettings = {
company": "COMPANY HANDLE"
"showDeflectionScreen": true
};
(function (d, s) { var e = d.createElement(s), t = d.getElementsByTagName(s)[0]; e.async = true; e.src = 'https://widget.amazd.co/widget.js'; t.parentNode.insertBefore(e, t);})(document, 'script');
</script>

4. Expert Selection Flow

The expert selection flow skips the deflections and lets the customer choose their expert from an expert selection list.

<script>
window.amazdSettings = {
company": "COMPANY HANDLE"
"showExpertSelectScreen": true
};
(function (d, s) { var e = d.createElement(s), t = d.getElementsByTagName(s)[0]; e.async = true; e.src = 'https://widget.amazd.co/widget.js'; t.parentNode.insertBefore(e, t);})(document, 'script');
</script>

5. Full Flow

The full flow integrates both the deflection screen, as well as the expert selection list.

<script>
window.amazdSettings = {
company": "COMPANY HANDLE"
"showExpertSelectScreen": true,
"showDeflectionScreen": true
};
(function (d, s) { var e = d.createElement(s), t = d.getElementsByTagName(s)[0]; e.async = true; e.src = 'https://widget.amazd.co/widget.js'; t.parentNode.insertBefore(e, t);})(document, 'script');
</script>

‍