> ## Documentation Index > Fetch the complete documentation index at: https://docs.sketricgen.ai/llms.txt > Use this file to discover all available pages before exploring further. # Deploy to Custom Website > Embed a SketricGen AI agent as a chat bubble or inline iframe on any website — step-by-step guide for custom web deployment. ## **Step 1: Create your SketricGen account** To get started with the integration, **[sign in to your SketricGen account](https://www.sketricgen.ai)**. If you don't have an account yet, you can create one for **[free](https://www.sketricgen.ai)**. Once you're logged in, begin setting up your agent workflow by uploading your data sources. These can include files, text snippets, websites, or Q\&A pairs, which will serve as the knowledge base for your agent workflow. If you need assistance with setting up a working SketricGen agent workflow, refer to the **[step-by-step guide](https://docs.sketricgen.ai/getting-started/quickstart)** for creating and deploying your agent workflow. ## **Step 2: Copy the SketricGen agent workflow Embed Code** After configuring your agent workflow, go to the dashboard and click **Publish** to copy the embed code. The code will look similar to this: ```html theme={null} ``` > **Note:** Make sure your agent workflow is set to **Public** to embed it on your website. Screenshot showing SketricGen dashboard with Publish button and embed code copy option ## **Step 3: Add the embed code to your website** If you have direct access to your website's files: 1. Open the file where you want to add the agent workflow (typically index.html, .astro, .jsx, or your template file) 2. Add the embed code in the `` section of your document 3. Save the file and upload it to your web server > **For multi-page websites:** Adding the script to the `` section of your base template or layout file ensures the chat bubble appears consistently across all pages of your website, giving visitors a seamless experience. ```html theme={null} ``` ## **Step 4: Test your agent workflow** After adding the embed code: 1. Preview or publish your website 2. Verify that the chat bubble appears (typically in the bottom right corner) 3. Test the agent workflow by clicking on the bubble and asking a question Screenshot showing custom website with embedded SketricGen floating chat widget 🎉 **Congratulations!** Your SketricGen agent workflow is now live on your website, ready to assist your visitors. ## **Step 1: Create your SketricGen account** To get started with the integration, **[sign in to your SketricGen account](https://www.sketricgen.ai)**. If you don't have an account yet, you can create one for **[free](https://www.sketricgen.ai)**. Once you're logged in, begin setting up your agent workflow by uploading your data sources. These can include files, text snippets, websites, or Q\&A pairs, which will serve as the knowledge base for your agent workflow. If you need assistance with setting up a working SketricGen agent workflow, refer to the **[step-by-step guide](https://docs.sketricgen.ai/getting-started/quickstart)** for creating and deploying your agent workflow. ## **Step 2: Copy the SketricGen agent workflow iFrame Code** From your dashboard, click **Publish > Direct Embed** and copy the iframe code. It should look similar to this: ```html theme={null} ``` > **Note:** The agent workflow must be set to **Public** for the iframe embed to work. Screenshot showing SketricGen Direct Embed iframe code copy interface ## **Step 3: Add the iFrame to your website** If you have direct access to your website's files: 1. Open the file where you want to embed the agent workflow (typically index.html, .astro, .jsx, or your template file) 2. Locate the section where you want the agent workflow to appear 3. Paste the iframe code 4. Adjust the width and height as needed 5. Save the file and upload it to your web server ```html theme={null}

Chat with our AI Assistant

``` ## **Step 4: Test your agent workflow** After adding the iframe: 1. Preview or publish your website 2. Verify that the agent workflow iframe appears correctly 3. Test the agent workflow by typing a question in the iframe Screenshot showing custom website with embedded SketricGen iframe widget 🎉 **Congratulations!** You've successfully added the SketricGen agent workflow to your website using an iframe embed.