> For the complete documentation index, see [llms.txt](https://help.supporthunt.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://help.supporthunt.com/chatbot-customisation/embed-bots-in-iframe.md).

# Embed bots in iFrame

### How do I display the chatbot in iFrame?&#x20;

It is pretty simple and requires minor changes in the code that you will need to make in-order to have the bot trigger in different window or tab. You can follow the following steps;&#x20;

* Go to 'Channel Configuration -> Web -> Configuration'&#x20;
* Enter the URL of your website in 'Website URL' where you would like the bot to be deployed
* Copy the 'Code Snippet'&#x20;
* Replace the following script source;

```
<div id="root" style="height:500px; width:500px"></div>
<script
src="https://chatbot.supporthunt.io/chat-widget/kRq5aWtGnnYg054032275570H2y2XAMR.js
"widget-container-id="root"></script>
```

* With the following script;&#x20;

```
<div id="root" style="height:500px; width:500px"></div>
<script
src="https://chatbot.supporthunt.io/chat-widget/g39gy4APmcc2095157146729LGoQGaw2.js
"widget-container-id="root"></script>
```

{% hint style="info" %}
You can change the height and the width of the chatbot or chatbot screen based on your preference by making changes in the above code, under "Height" & "Width" option by using either pixels (px) or percent (%)
{% endhint %}

* Copy & paste the code snippet post making changes in the code on those pages of your website where you would like to display the bot

{% hint style="info" %}
Support Hunt recommends having the code copied before the \<Body> tag in-order to ensure that the bot triggers as soon as the web page loads
{% endhint %}


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://help.supporthunt.com/chatbot-customisation/embed-bots-in-iframe.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
