Add Aidan chat to your website

Aidan is the quote chat that lets visitors describe their yard, confirm their address, and get a quote directly on your website.

You can add it by pasting two short lines of code where you want the chat to appear. It works with most websites and site builders, including mobile websites.

On web:

On mobile:

If someone else manages your website, send them this article or the code from the section below.

Before you start, you need:

Your widget key identifies which Duranta company the chat belongs to. It is safe to use on a public website.

Your Aidan embed code and widget key are provided by the Duranta Sales or Customer Success team.

The copied snippet looks like this:

If you're entering the code manually, replace YOUR_KEY with your widget key.

The first line marks where the chat appears on the page. The second line loads Aidan into that location.

The first line:

goes in the body of the page, in the section where you want the chat to appear.

The script line can go in one of these places:

If you place the script in the header, remove async:

Add only one Aidan chat to a page.

If the page does not include the first line, the chat appears directly above the script. In that case, the script must be placed in the body where you want the chat to appear.

Aidan uses the width of the Code block.

For a site-wide script, add only the script line under Settings → Advanced → Code Injection → Footer.

Then add the first line to a Code block on each page where Aidan should appear.

A Wix HTML embed runs inside its own frame, so the chat stays inside the box.

On phones, full-screen chat does not work inside this HTML embed.

To allow full-screen behavior on phones, add the script using Wix Custom Code and keep the first line in the page content outside the embed box.

Add a custom HTML or embed block where you want the chat to appear, then paste both lines into it.

Aidan uses the width of the block.

Place it in a normal page section. Avoid sections that move after the page loads, such as auto-advancing carousels.

Aidan normally uses the full width of the block where it is placed.

To make it narrower, add a maximum width to the first line:

Aidan is 700px tall by default.

To use a different height, add data-height to the script:

The value is measured in pixels.

When a visitor starts typing on a phone, Aidan expands to cover the screen so the keyboard does not interfere with the page.

While Aidan is full screen, your custom height setting is temporarily ignored.

When the visitor closes the chat, they return to the same place on your website.

If your website uses a content security policy, allow:

https://app.getduranta.com

for both:

If your site requires a nonce for scripts, add the same nonce to the Aidan script.

If your website already uses the older iframe embed, it will continue to work.

However, the old iframe does not include the mobile-responsive behavior of the new embed.

On phones, the chat remains inside the iframe instead of expanding to a full-screen experience.

The old embed looks like this:

To upgrade:

The script replaces the iframe in the same location and keeps its existing title, permissions, and height unless you specify a different data-height.

After upgrading, Aidan can use the new mobile-responsive behavior, including the full-screen experience on phones.

For new installations, use the recommended two-line embed.

See Add Aidan chat to your website: FAQ