If you’ve made it here, you’re probably looking for a way to get your Tess AI agents in front of more people, right? The Agent Embedding feature is the perfect solution for that! With it, you can put your agents straight onto any external site, making them accessible to an even bigger audience—even folks who aren’t subscribed or registered on the platform.
Let’s dive into the details of how this works and how you can get the most out of this feature.
What Is Agent Embedding and Why Use It?
Picture having your customer service agent, a sales assistant, or even an interactive guide right on your own website, blog, or online store. That’s exactly what Embedding lets you do!
This feature creates a bridge between Tess and your external channels, so anyone visiting your site can chat smoothly with your agents. The main benefit? People who aren't Tess AI users can use your agents, which is perfect for streamlining support, generating leads, or offering info in an automated and efficient way.
The most common use cases include:
Customer Service: A chatbot to answer FAQs and guide users.
Lead Generation: An agent that collects contact info from interested visitors.
Support and Questions: A virtual assistant that provides help and tutorials.
How It Works: From Agent to Embeddable Code
The process to embed your agent is super simple and intuitive. Check out the step by step:
Create and Set Up Your Agent in Tess AI: First make sure your agent is ready and set up the way you want inside Tess AI's AI Studio. It should be responding as you expect and have the knowledge base you need.
Important: your agent doesn't have to be public, but it does need to be published. You can use it with Public, Private, Unlisted or Workspace visibility.
Access the Embedding Options: When you're about to publish your agent, along with the options for description, image, and monetization, you'll see a section just for Embedding. That's where the magic happens!
Pick the Best Format for You: Tess AI gives you three different ways to display your agent. Which one you pick depends on how you want it to show up on your site:
Chat Pop-up:
This is the most common and discreet format. The agent shows up as a small floating icon in the corner of the screen. When you click it, a chat window pops up so you can interact.
Standard:
The agent is built in as a fixed component in a specific part of your page. It doesn't float and acts as part of the content.
Full Page:
The agent takes up the whole page, giving an immersive experience focused on interaction.
Copy the Embed Code: After picking the format, Tess AI will automatically generate a code snippet (in HTML).
Paste the Code on Your Website: Now just copy that code and paste it into your site's source code (frontend). The exact spot will depend on your site structure and the format you chose (it's usually inside the <body> or <head> tags of your HTML, depending on how you're integrating). If you're using a CMS (Content Management System) like WordPress, Wix, or a site builder, look for options to add "custom code" or "HTML/JavaScript".
Tips for a Successful Integration
Always Test: After embedding the agent, test it on your site to make sure everything works as expected and the user experience is smooth.
Responsive Design: Tess AI cares about this, but check how the agent behaves on different devices (phones, tablets, desktops) to make sure it's always optimized.
Clear Call to Action: If the agent isn't "Full Page", use clear text or an icon that invites the user to interact with it.
Consumption
Credit usage on public agents (shown on other sites) is different from the usage inside Tess AI. When you make an agent public using Embedding, the usage is the same as using it by API (you can check out our article: link), and there are no unlimited models. Naturally, usage changes according to the LLM used in the agent and the number of interactions!
Conclusion
The Agent Embedding feature in Tess AI is a powerful tool to expand your agents’ presence and give your site visitors an interactive and efficient experience. Whether it's to improve support, collect leads, or just provide info in a dynamic way, embedding opens up a world of possibilities.
