ZZetra

Wix

Embed your Zetra agent on a Wix site with the website widget code.

Overview

Adding your agent to a Wix site takes the website widget code from your Zetra dashboard and Wix's Custom Code setting. Once added, a floating chat bubble appears on your site.

What you can do

Put your agent in front of every visitor to your Wix site, answering questions without them leaving the page.

Before you start

  • A Zetra account with an agent. If you haven't built one yet, create a free account and follow the Quick start.
  • A Wix site you can edit, on a Wix plan that allows custom code (a connected domain is required by Wix for custom code).

How to embed your agent

  1. Copy your embed code

    1. Go to your Zetra dashboard and open the agent you want to add.
    2. Click Channels in the left sidebar, then Manage on the Chat bubble card.
    3. Under Embed code, choose Website widget and click Copy.

    The website widget is one script tag. It adds a floating chat bubble to the corner of the page. You can also copy it from the Deploy button at the top right of any agent page.

  2. Open your site's Custom Code settings

    In your Wix dashboard, go to Settings, scroll to Development & integrations and click Custom Code.

  3. Paste the code

    Click + Add Custom Code, then:

    1. Paste your Zetra code into the box.
    2. Give it a name, such as "Zetra chat".
    3. Under Add Code to Pages, choose All pages (or the pages you want).
    4. Under Place Code in, choose Body - end.
    5. Click Apply.

Check it works

Open your published site. The floating chat bubble appears in the corner. Wix doesn't run custom code in the editor preview, so check the live site.

Want it in one spot instead?

In the editor, use Add Elements → Embed Code → Embed HTML, paste the iFrame code and size the box. The chat then shows inline on that page only.

Troubleshooting

The chat doesn't appear

Possible cause: the code was pasted into the wrong place, the page wasn't republished, or your agent is switched off.

Solution: Check that the whole code was pasted (it starts with <script or <iframe), publish the site again, and open it in a private window. In Zetra, open Channels → Chat bubble and make sure Visibility is on. If you listed allowed domains under Settings → Security, your site's exact address (with https:// and www if you use it) must be on the list.

Make it look like your brand

The chat's look and wording come from your Zetra dashboard, not the site builder. Open your agent, click Playground, then the Display tab to change the theme, colours, bubble icon and position, welcome message and suggested questions. Changes show up on your site straight away, with no need to paste the code again.

Next steps

Customize the chat →Match the widget to your brand colours, position and wording.Channels →Every other place your agent can talk to customers.
← WordPressWeebly →