HELP CENTER

AI Web Chat Plugin

Add an intelligent chat to your website to automatically assist visitors with the same AI as WhatsApp.

What is the Chat Plugin?

The chat plugin allows you to add an AI assistant to any website. Visitors can chat directly with the AI without needing WhatsApp, and you can assist them using the same integrations and features you already have configured.

  • Automatic responses with AI trained on your business
  • Access to product, customer, and customized function search
  • Multi-language support with automatic translation
  • 10 customizable design themes
  • Floating mode (button in corner) or embedded (inside a div)

How to activate the plugin

  1. Open the WAzion Dashboard
  2. In the side menu, click on “Plugins“ → “Chat
  3. Activate the “Plugin active“ switch
  4. Add your domain in “Authorized Domains“ (e.g., mitienda.com)
  5. Copy the integration code and paste it into your website

Integration code

Copy this code and paste it before closing the tag of your website:

<!-- WAzion Chat Web -->
<script>
(function(w,d,s,t){if(w.WazionPlugin)return;w.WazionPlugin={token:t};
var js=d.createElement(s);js.async=true;
js.src='https://www.wazion.com/plugins/chat/embed.js';
js.dataset.token=t;d.body.appendChild(js);
})(window,document,'script','TU_TOKEN_AQUI');
</script>

The token is generated automatically when activating the plugin. You will find it in the chat settings section.

Embedded mode (optional)

If you prefer to insert the chat inside a specific container instead of as a floating button, wrap the code in a div:

<div id="mi-chat" style="height: 500px;">
  <script>
  (function(w,d,s,t){if(w.WazionPlugin)return;w.WazionPlugin={token:t};
  var js=d.createElement(s);js.async=true;
  js.src='https://www.wazion.com/plugins/chat/embed.js';
  js.dataset.token=t;d.body.appendChild(js);
  })(window,document,'script','TU_TOKEN_AQUI');
  </script>
</div>

The chat will be rendered inside the container div instead of as a floating button.

Shopify Installation Guide

Follow these steps to add the chat to all the pages of your Shopify store.

1

Access the theme editor

In your Shopify admin panel:

  1. Go to Online Store in the left side menu
  2. Click on Themes
  3. In your current topic, click the ... (three dots) button
  4. Select Edit code
2

Search for the theme.liquid file

In the left sidebar of the editor:

  1. Look for the Layout folder
  2. Click on theme.liquid

Note: theme.liquid is the main file that loads on every page of your store.

3

Locate the tag

In the code editor:

  1. Use Ctrl+F (Windows) or Cmd+F (Mac) to search
  2. Write </body> and press Enter
  3. You will find the label near the end of the file
4

Paste the chat code

Paste the following code JUST BEFORE :

<!-- WAzion Chat Web -->
<script>
(function(w,d,s,t){if(w.WazionPlugin)return;w.WazionPlugin={token:t};
var js=d.createElement(s);js.async=true;
js.src='https://www.wazion.com/plugins/chat/embed.js';
js.dataset.token=t;d.body.appendChild(js);
})(window,document,'script','TU_TOKEN_AQUI');
</script>
<!-- /WAzion Chat Web -->
</body>

Important: Replace YOUR_TOKEN_HERE with the token that appears on your WAzion Dashboard.

5

Save the changes

Click the Save button in the top right corner of the editor.

6

Check the installation

Visit your store in an incognito window. You should see the chat button in the corner of the screen.

Alternative method: Custom Pixels (Shopify Plus)

If you have Shopify Plus, you can use Custom Pixels:

  1. Go to SettingsCustomer PrivacyCustom pixels
  2. Click on Add custom pixel
  3. Give it a name (e.g., “WAzion Chat“)
  4. In the code field, paste:
analytics.subscribe("page_viewed", (event) => {
  if (window.WazionPlugin) return;
  window.WazionPlugin = {token: 'TU_TOKEN_AQUI'};
  const js = document.createElement('script');
  js.async = true;
  js.src = 'https://www.wazion.com/plugins/chat/embed.js';
  js.dataset.token = 'TU_TOKEN_AQUI';
  document.body.appendChild(js);
});

WordPress Installation Guide

Option 1: With plugin (recommended)

Use a plugin to insert code into the footer:

  1. Install the plugin Insert Headers and Footers (by WPCode) or similar
  2. Go to Code SnippetsHeader & Footer
  3. In the Footer section, paste the chat code:
<script src="https://www.wazion.com/plugins/chat/embed.js"
        data-token="TU_TOKEN_AQUI"></script>

Save the changes and the chat will appear on all pages.

Option 2: Editing functions.php

Notice: This method requires basic knowledge of PHP. Make a backup beforehand.

  1. Go to AppearanceTheme File Editor
  2. Select functions.php in the file list
  3. Add this code at the end of the file:
// WAzion Chat Web
function wazion_chat_script() {
    echo '<script src="https://www.wazion.com/plugins/chat/embed.js"
          data-token="TU_TOKEN_AQUI"></script>';
}
add_action('wp_footer', 'wazion_chat_script');

Guide for HTML/other sites

For any website (static HTML, React, Vue, Angular, etc.):

Basic structure

Paste the code just before in your HTML file:

<!DOCTYPE html>
<html>
<head>
    <title>Mi sitio web</title>
</head>
<body>
    <!-- Tu contenido aquí -->

    <!-- WAzion Chat Web - Pegar AQUÍ, antes de </body> -->
    <script src="https://www.wazion.com/plugins/chat/embed.js"
            data-token="TU_TOKEN_AQUI"></script>
</body>
</html>

For SPA applications (React, Vue, Angular)

You can load the script dynamically:

// En tu componente principal o App.js
useEffect(() => {
  const script = document.createElement('script');
  script.src = 'https://www.wazion.com/plugins/chat/embed.js';
  script.dataset.token = 'TU_TOKEN_AQUI';
  script.async = true;
  document.body.appendChild(script);

  return () => document.body.removeChild(script);
}, []);

Problem solving

The chat does not appear

  • Check that the plugin is activated in the Dashboard
  • Check that your domain is on the list of authorized domains
  • Open the browser console (F12) and look for errors
  • Test in an incognito window to rule out cache issues

Error “Unauthorized domain

  • Add your exact domain to the authorized list (without http:// or /)
  • If you use www, add both “midominio.com“ and “www.midominio.com
  • For local development, add “localhost“ or use “*“ temporarily

The chat appears but does not respond

  • Check that you have credits available in your account
  • Check that the token is correct
  • Check if you have reached the rate limiting threshold

Configuration options

Authorized Domains

List of domains where the chat can operate. For security reasons, usage is only allowed from domains you have authorized.

  • • mitienda.com
  • • *.mitienda.com (includes subdomains)
  • • * (any domain - for development only)

Display Mode

Floating

Displays a button in the corner of the page. When clicked, the chat window opens.

Embedded

The chat is embedded within a div container on your page, ideal for contact pages.

Floating Button Configuration

  • Position: Bottom right, bottom left, top right or top left
  • Icon 6 icons available (bubble, message, support, robot, etc.)
  • Colors: Customizable background color and icon color
  • Size: Small (48px), Medium (60px), Large (72px)
  • Animation: None, pulse or bounce to get attention
  • Tooltip: Text displayed when hovering the mouse over the button

Design Topics

10 pre-designed themes to customize the chat to your brand:

Minimal Modern Classic Dark Ocean Sunset Forest Rose Slate Neon

Chat Texts

Customize the texts that the visitor sees:

  • Chat title (header)
  • Welcome message
  • Text field placeholder
  • Send button text

The texts are automatically translated into the visitor’s language.

Language Settings

Auto-detect

Automatically detects the visitor’s browser language.

Fixed language

Always display in a specific language (e.g., only Spanish).

With selector

Automatically detects but allows the visitor to manually change the language.

Behavior

  • Auto-open: Open the chat automatically after X seconds
  • Sound: Play sound when receiving message
  • Branding: Show “Powered by WAzion“ in the chat

Rate Limiting (Message Limit)

Protect your account from excessive use by setting session limits:

  • Maximum number of messages per time window (e.g., 30 messages)
  • Time window in minutes (e.g., 60 minutes)

Chat Prompt

You can write specific instructions for the web chat or sync with your WhatsApp prompt:

  • Modify with AI: Write instructions in natural language (e.g., “add business hours from 9 am to 6 pm“) and the AI will automatically modify your prompt. You will see a visual diff with the changes: text added in green and deleted in red.
  • Import from general template: Copy your WhatsApp prompt to the plugin with one click.
  • Version history: Each time you save, a version is created. You can restore any previous version.

Automatic synchronization: From the Prompt Editor, you can check the option “When saving, update web plugin prompt.“ The AI will automatically adapt your prompt by removing references to WhatsApp.

Custom CSS

For advanced settings, you can add custom CSS that will be applied to the chat.

Functions of AI in Chat

The chat AI has access to the same functions as your WhatsApp assistant:

Product Search

AI can search for products in your store and display information.

Customer Information

If you have CRM or Shopify connected, the AI accesses customer data.

Web Search

If enabled, the AI can search for information on the internet.

Custom Functions

Your custom functions (function calling) work in the chat.

Statistics and Conversation Viewer

Usage metrics

In the Dashboard, you can see the chat usage metrics:

  • Total conversations
  • Total messages
  • Conversations in the last 7 days
  • Active sessions in the last 24 hours

Conversation Viewer

Review all chat conversations with your visitors:

  • Filter by period: Today, 7 days, 30 days, 90 days, 1 year, all, or custom date range
  • Paginated list: Browse all conversations (10 per page)
  • Full detail: Click on any conversation to see all the messages
  • Visitor information: Language, number of messages, and source page

Open with predefined message

You can open the chat with a predefined message by adding the parameter ?Message= to the URL:

https://mitienda.com/contacto?Message=Quiero información sobre el producto X

The chat will open automatically and send the specified message.

Frequently Asked Questions

Related articles

WAzion Assistant

Commercial information and technical support

Hello! I am the WAzion assistant. I can help you with information about prices and plans, technical questions, configuration, or any questions about our product. How can I assist you?
Developed with WAzion AI