Environments in Chatmode define where and how your AI agents interact with users. They serve as the connection between your agents and various platforms or channels, primarily through embeddable web chats (EMBED) or specific integrations like ZAPI.

​
Understanding Environments

An environment represents a specific deployment of an agent. For example, you might have:

  • A customer support agent on your website
  • The same agent deployed via API for your mobile app
  • Another instance of the agent for internal use by your team

Each of these would be a separate environment in Chatmode, potentially with different configurations tailored to each use case.

​
Environment Types

Chatmode currently supports the following environment types defined in the system:

​
Embed (EMBED)

Embed a chat interface directly on your website using an <iframe>, allowing visitors to interact with your agent.

​
ZAPI

Connect your agent through specific integrations configured under this type (e.g., potentially WhatsApp via Z-API). Detailed configuration depends on the specific integration.

​
Creating an Environment

To create a new environment:

  1. Navigate to the Environments section in the sidebar
  2. Click the Create Environment button
  3. Select the environment type
  4. Choose the agent to deploy in this environment
  5. Configure the environment settings (varies by type)
  6. Save your configuration

​
Environment Settings

​
General Settings

All environments include these common settings:

  • Name: Identify your environment
  • Agent: The AI agent that will power this environment
  • Active Status: Toggle to enable/disable the environment
  • Preferred Language: Set the default language for interactions

​
Embed (EMBED) Settings

When creating an Embed (EMBED) environment, you can customize aspects of the chat interface presented:

  • Display Name: The text shown in the chat header.
  • Display Picture: The logo or avatar shown in the chat header.
  • Icon: The icon displayed on the floating chat bubble when closed.
  • Primary Color: Affects buttons and other accents within the chat interface.
  • Initial Message: The first message the Agent sends when the chat loads.

​
ZAPI Environment Settings

Configuration for ZAPI environments depends on the specific integration being set up. This typically involves API keys, endpoint URLs, or other credentials required by the third-party service.

​
Implementing Environments

​
Embed (EMBED) Implementation

After creating an Embed environment, you need to add an <iframe> element to your website’s HTML. The src attribute should point to the public chat page for your environment ID.

<!-- Example Iframe Embedding -->
<iframe
  src="https://<your-chatmode-app-domain>/en/chats/YOUR_ENVIRONMENT_ID"
  width="400"
  height="600"
  style="border: none; /* Add other styles as needed */"
  title="Chatmode Assistant"
></iframe>

<!--
  Replace <your-chatmode-app-domain> with the actual domain where your Chatmode instance is hosted.
  Replace YOUR_ENVIRONMENT_ID with the ID of your created Embed environment.
  Adjust width, height, and styles as needed.
-->

Place this <iframe> tag where you want the chat interface to appear on your page.

(Note: The primary recommended implementation for the floating chat bubble uses a script snippet provided in the UI, as detailed in the Embeds guides. The iframe method is mainly for inline embedding.)

​
API Implementation (ZAPI)

Implementation for ZAPI environments involves configuring the connection according to the specific service (e.g., providing webhook URLs, API keys). Refer to the configuration section within the environment details page after creation.

​
Managing Environments

​
Environment List

The Environments page displays all your environments with key information:

  • Environment name and type
  • Associated agent
  • Active status
  • Creation date
  • Usage statistics

​
Environment Details

Click on an environment to view its details and access:

  • Configuration settings
  • Implementation code
  • Usage metrics (if applicable)
  • Conversation history (if applicable)

​
Monitoring and Analytics

Detailed monitoring and advanced analytics per environment may not be universally available. Review associated conversations for insights.

​
Best Practices

  1. Test in Staging: Before deploying to production, test your environment in a controlled setting
  2. Customize for Context: Tailor environment settings to match the platform and user expectations
  3. Monitor Regularly: Check environment performance and make adjustments as needed
  4. Implement Fallbacks: Configure behavior for when an agent can’t handle a request (if applicable)

​
Next Steps

After setting up your environment:

  1. Test your agent in the new environment
  2. Monitor conversations to ensure everything works correctly
  3. Customize appearance for website widgets