Integrate
The Integrate Module in Great Wave AI Studio enables you to embed your AI agent into websites, customize its visual style using HTML/CSS, and integrate it with third-party platforms like Telegram. This guide covers each section of the panel for easy setup and deployment.
IFrame Code
This section provides a ready-to-use <iframe> snippet to embed the agent directly into any website.
Iframe Source: URL pointing to your deployed chat agent.
Width/Height: Define the embedded frame size (modifiable based on layout needs).
Styling:
No border
Custom border radius
Drop shadow for visual depth
Bottom border for stylistic separation
Usage:
Copy and paste the entire
<iframe>tag into your site’s HTML.Adjust
widthandheightas needed.
fetch() and HTML Code
This panel provides a sample HTML and CSS snippet for embedding the agent as a floating widget using fetch() styling and placement.
#gw-holder: Absolute positioning layer that spans the full viewport.
#gw-box: Styles the chat widget (positioned at the bottom-right corner of the screen).
Rounded corners
Padding and border styling
Smooth hover effects
Drop shadow for depth
#gw-question: Style for suggested or automated messages.
White text
Colored background
Center-aligned with padding
Usage:
Embed the provided
<style>block into your site’s<head>section.Customize properties (e.g., colors, sizes) to match your site’s theme.
Third Party Apps – Telegram Integration
This section allows you to connect your AI agent to a Telegram bot.
Telegram Bot Key Input: Paste your Telegram bot token here.
Save Button: Saves the connection.
Clear Button: Removes the saved bot key.
Usage:
Generate a bot key from Telegram’s BotFather.
Paste the key and click Save to activate integration.
Users can now interact with your AI assistant through Telegram.
Last updated