How to Embed Anthropic Claude in your Website

In this article we're going to show you how you can easily embed a Claude AI Chatbot into your website in 5 minutes.  The embedded Claude chatbot is fully customizable, you can choose to use the latest Claude models from Anthropic, and you can train the Claude bot on all of your website data in one click.

With your embedded Claude Chatbot, you can use your logo and branding, set up human escalation to invite in your team as needed by integrating Microsoft Teams, Slack, Zoom or Webex natively.  Set up keywords that can trigger chat escalation to humans and monitor active chats so your company can respond to your website visitors at the appropriate time in the chatbot conversations.  Create custom AI Actions in your Claude Chatbot to lookup real-time data, and easily re-train and refine your chatbot to improve your Claude integration.

Here are some things you can do with your embedded Claude chatbot in your website:

  • Pre-qualify your leads with a chatbot
  • Train your Claude chatbot on website data
  • Choose your Claude model including Claude 3.7 Sonnet and all recent models
  • Set up initial System messages for the Claude API
  • Setup Human Escalation Trigger phrases that will invite agents to your visitor conversations
  • Lookup customer information using custom AI Actions to access API data
  • Set up Questions and Answers about your business for additional chat context
  • Send links to important URLs
  • Register leads to your CRM, mailing list, or ticket system with a chatbot
  • Direct your website visitors to website information with Claude

Embed Claude AI in Website

Here's a step by step guide to embedded Claude in your website with Anthropic + Social Intents.

High Level Steps

  1. Create your Claude Account and API Key
  2. Create your Social Intents Free Trial
  3. Train your Chatbot on your data

Step 1.  Create your Claude account and create API Key

If you haven't already, sign up for your Anthropic console account here: https://console.anthropic.com/login

Anthropic Claude Home

Make sure to click on API then Console Login:

Claude Console Login Page

Once logged in to Claude, click on 'API keys' in the lower left-hand navigation:

Claude API Keys Link

Now create a new Claude API key to use in your Social Intents Chatbot Settings.  Once you click Add on the Create API Key, copy that key for use in the Social Intents settings in the next step.

Claude Create API Key

Step 2. Create a Social Intents Free Trial

If you don't already have an account with Social Intents, simply register for a Free Trial.

Once you sign up, select  'Create an AI Chatbot'.

Signup Create AI Chatbot

Step 3. Train your Chatbot on your Website Data

Next, enter your website URL and click Add to add your website pages to your training data.

Claude Chatbot Training Website Data

Click 'Train all data', to train your new chatbot on your website data then click 'Next'

Claude Chatbot Trained

That's it!  Your Chatbot is now trained on your website data and ready to deploy.  You can grab your code snippet to embed in your website now or copy it later.

Step 4.  Copy your Live Chat Code Snippet to your Website

Now just copy the Live Chat code snippet to your website to enable the Claude chat on your site.

And grab your code to add to your website pages or template:

Step 5.  Add your Claude API Key to your Chatbot Settings

Click into your Live Chat settings and head over to the AI Chatbot tab.  The first field you'll see is your AI Model - this is where you can pick the best Claude Model to use for your Chatbot.  Finally, enter your API Key that you configured in Step 1 above from Claude into the API Key section and Save.

That's it!  Your Claude Chatbot is added on your website!

Now you're ready to test your chatbot powered by Claude and your chat is enabled on your website and is ready to answer your visitor questions using Claude AI!

Embedded Claude Chatbot

Ready to Integrate Slack or Microsoft Teams for Agent Escalation?

Optionally, you can add additional integrations for your agents to answer chats, or visitors to start chats from WhatsApp or Messenger in addition to the website chat.

Claude Chatbot Integrations

Ready to Get Started by embedding Claude in your website?

Start our free 14-day Trial to add a website enabled live chat widget powered by Claude to your website.