# Adding widget to your website

You can add the chatbot to your website by following the steps below.&#x20;

1. Open the Chatbot that you are planning to add to your help center
2.  Navigate to the **Settings** > **Deployment** and copy the snippet for your chatbot.\
    &#xNAN;_&#x4E;ote: You can toggle between the **draft** and **published** version_ \


    <figure><img src="https://534431549-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FbO3m8ycFG8xg77R5w9dH%2Fuploads%2Fbby1MdttLzeARLZzMK8p%2Fimage.png?alt=media&#x26;token=be8594ed-3c07-4597-a984-693082b63696" alt=""><figcaption></figcaption></figure>
3. Next, add the script tag to the `head` or the `body` tag of the webpages you want the chatbot to be shown\
   \
   Navigate to the webpage you will now be able to see the chatbot appear.

<figure><img src="https://534431549-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FbO3m8ycFG8xg77R5w9dH%2Fuploads%2FXKgJyD9KOqCYjXwybWyg%2Fimage.png?alt=media&#x26;token=7881d1f3-ed74-416b-aa54-ff2b0c55576d" alt=""><figcaption></figcaption></figure>

### Note

The chatbot script is by default configured to always show the widget. In cases you want to customize when the widget shows and metadata refer to the article below.

{% content-ref url="custom-initialization-and-passing-metadata" %}
[custom-initialization-and-passing-metadata](custom-initialization-and-passing-metadata)
{% endcontent-ref %}



\
