Skip to main content
Dial AI chat links are built to be embeddable in external applications. This allows customers to interact with Grace on an existing website or application they already use. You can create an embeddable chat link by adding a Web Point of Contact (Agent > Points of Contact > Web > Create). Create Web Point of Contact After creating the chat link, you should give it a name. This will appear under “point of contact” in the conversation’s page once people start using it. Edit Web Point of Contact Finally, you can go to the “Generate” tab to copy the embeddable link. There are also a host of options to customize the chat link. Generate Chat Link The simplest way to embed the chat link is to use an <iframe> tag. 
<iframe src="https://demo.dialai.ca/Dial AI/chat/3a58f15a-ff00-4ff7-a7e1-4762df38d207" width="1000"
        height="1000"></iframe>

​
Open on Button Click

You can, of course, add a button to toggle the iframe on and off. Chat context will be preserved between iframe reloads. 
document
    .getElementById('toggle-chat')
    .addEventListener('click', () => {
        const id = 'dial-ai-chat'
        if (document.getElementById(id)) {
            document.getElementById(id).remove()
        } else {
            const iframe = document.createElement('iframe')
            iframe.id = id
            iframe.src = "https://demo.dialai.ca/Dial AI/chat/3a58f15a-ff00-4ff7-a7e1-4762df38d207"
            iframe.width = "500"
            iframe.height = "500"
            document
                .getElementById('root')
                .append(iframe)
        }
    })