> For the complete documentation index, see [llms.txt](https://openassistantgpt.gitbook.io/openassistantgpt/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://openassistantgpt.gitbook.io/openassistantgpt/create-a-chatbot/embed-in-website.md).
# Embed in website
\
To embed the chatbot into your website, follow these steps based on your web development setup:
For **HTML**:
1. Insert a script tag in your HTML with a `chatbotConfig` object containing the `chatbotId`.
2. Add the chatbot script source `https://openassistantgpt.io/chatbot.js` in your body tag.
```html
```
For **Next.js**:
1. Use the "use client" directive.
2. Import `Script` from 'next/script' and `useEffect` from 'react'.
3. Inside the `useEffect` hook, set the `window.chatbotConfig` with your `chatbotId`.
4. Use the `Script` tag to include the chatbot script with `strategy="afterInteractive"` in your main component.
```javascript
"use client"
import Script from 'next/script'
import React, { useEffect } from 'react';
export default function Home() {
useEffect(() => {
// Set your global variable here
window.chatbotConfig = {
chatbotId: "clq5598dc000hrrwh5t6s1m"
};
}, []);
return (
)
}
```
These steps allow the chatbot to be seamlessly integrated and accessible on your website.