How to Create Your Agent Embed Code

Follow these simple steps to generate HTML code that embeds your Agent.ai form on any website.

Before You Start

You'll need two things from your Agent.ai dashboard:

1. Your Start Agent webhook cURL (triggers your agent)
2. Your Get Results webhook cURL (checks the status)

Where to Find Your Webhook cURLs:

1. Log into your Agent.ai account
2. Navigate to your agent's settings
3. Click on the "Trigger" tab
4. Under "Webhook", you'll find both cURL commands
5. Copy each one when prompted

Step-by-Step Guide

📝 Step 1: Paste Your Start Agent Webhook

When you see "Start Agent cURL", paste your entire webhook command.

It should look something like this:

curl -X POST 'https://api.agent.ai/v1/agent/kq8f9lxhp22ezt06/webhook/ca63a78c/async' \
  -H 'Content-Type: application/json' \
  -d '{"user_input":"REPLACE_ME","question":"REPLACE_ME"}'

Important: Paste the ENTIRE command, including all the curl options and JSON data.

📊 Step 2: Paste Your Get Results Webhook

When you see "Get Results cURL", paste your status-checking command.

It typically looks like:

curl -X GET "https://api.agent.ai/v1/agent/kq8f9lxhp22ezt06/webhook/ca63a78c/status/<run_id>"

🎨 Step 3: Customize Your Button

You'll be asked three quick questions to style your submit button:

1. Button Text: What should the button say?

   • Examples: "Submit", "Send", "Ask Agent", "Get Started"
   • Just type what you want users to see

2. Button Color: What color should it be?

   • Use hex codes: #0091ae, #FF5733, #28a745
   • Or color names: blue, green, tomato
   • Leave blank for default blue

3. Rounded Corners: Want rounded button edges?

   • Type yes for rounded corners
   • Type no or leave blank for square corners

✅ Step 4: Generate Your Code

Click the "Go" button and wait a few seconds while the agent:

• Analyzes your webhooks
• Creates custom form fields
• Generates your embed code

📋 Step 5: Copy Your Embed Code

You'll see your custom embed code in a dark code block with a "📋 Copy Code" button.

1. Click "Copy Code"
2. You'll see "✓ Code copied!" confirmation
3. Paste this code into your website's HTML

Where to Paste Your Code

WordPress

1. Edit your page/post
2. Add a "Custom HTML" block
3. Paste the code
4. Update/Publish

HubSpot

1. Navigate to your page in the page editor
2. Add a "Custom HTML" module
3. Paste the code in the HTML section
4. Click "Apply changes" and publish

Webflow

1. Add an "Embed" element
2. Paste the code
3. Publish your site

HTML Website

1. Open your HTML file
2. Paste the code where you want the form
3. Save and upload

Other Platforms

• Wix: Use the HTML iframe element
• Squarespace: Use a Code Block
• Shopify: Edit your theme's HTML
• Any CMS: Look for "HTML", "Code", or "Embed" options

What Your Visitors Will See

Once embedded, your visitors will see:

1. A clean form with input fields matching your agent's requirements
2. Your custom button with the text and style you chose
3. Real-time feedback when they submit (shows "Processing...")
4. The agent's response displayed right below the form

Tips for Success

✨ Best Practices:

• Test your form after embedding
• Make sure your webhook URLs are correct
• The form adapts to your website's font styles
• Works on mobile devices automatically

⚠️ Common Mistakes to Avoid:

• Don't paste partial cURL commands
• Don't forget both webhooks (Start AND Results)
• Don't modify the generated code unless you know HTML/JavaScript

🎯 Pro Tips:

• Match your button color to your brand
• Use clear, action-oriented button text
• Place the form where it's easy to find
• Consider adding instructions above the form

Need Help?

If your form isn't working:

1. Double-check you pasted complete cURL commands
2. Verify your agent is active in Agent.ai
3. Check your browser's console for errors
4. Try regenerating the code with fresh webhook cURLs