# Chatbot Appearance and message

`https://www.owlbot.ai/api/bot/[id]/update/`

Where \[id] is the chatbot *uuid* of the chatbot you want to update.

in terms of design, there is a lot of parameters you can play with : 

### For Chatbot Window

| Property                    | Type   | Description |
| --------------------------- | ------ | ----------- |
| **bot\_primary\_color**     | string | Optional.   |
| **bot\_secondary\_color**   | string | Optional.   |
| **bot\_user\_icon**         | string | Optional.   |
| **bot\_assistant\_icon**    | string | Optional.   |
| **bot\_title**              | string | Optional.   |
| **welcome\_message**        | string | Optional.   |
| **bot\_input\_placeholder** | string | Optional.   |
| **bot\_footer\_text**       | string | Optional.   |

### For Chatbot Bubble

The chatbot bubble is the always visible bubble (often placed at the bottom left of the screen).

If your using it, it can be useful to customise it to match the colours and design of your site.

Here is the parameters you can play with :

| Property                                | Type   | Description |
| --------------------------------------- | ------ | ----------- |
| PLACEHOLDER\_IFRAME\_POSITION\_BOTTOM   | string | Optional.   |
| PLACEHOLDER\_IFRAME\_POSITION\_RIGHT    | string | Optional.   |
| PLACEHOLDER\_TOOLTIP\_WELCOMME\_MESSAGE | string | Optional.   |
| PLACEHOLDER\_TOOLTIP\_MAIN\_COLOR       | string | Optional.   |
| PLACEHOLDER\_TOOGLE\_BUTTON\_IMG\_OPEN  | string | Optional.   |
| PLACEHOLDER\_TOOGLE\_BUTTON\_IMG\_CLOSE | string | Optional.   |

## Some Example :

If you want to update the primary Color to Red Color. (`#FF0000`) and the bot Title to "test".

#### In Javascript / Fetch

dont forget to change \[id] by your chatbot `UUID`.

```javascript

let dataToUpdate = {
bot_primary_color : "#FF0000",
bot_title : "test"
}


fetch('https://www.owlbot.ai/api/bot/[id]/update/', {
  method: 'POST',
  headers: {
    'Authorization': 'abcdefghj',
  },
  body: JSON.stringify({
  dataToUpdate : dataToUpdate,
  botId : [id]
  })
}).then(res => res.json())
  .then(res => console.log(res));
```

## Response

response is a HTTP 200 with the newly updated chatbot property as JSON. 

<pre class="language-json"><code class="lang-json"> {
         "id":91,
         "created_at":"2023-06-28T07:01:58.308677+00:00",
         "bot_title":"test", <a data-footnote-ref href="#user-content-fn-1">&#x3C;== updated property</a>
         "bot_footer":"Powered by Owlbot",
         "bot_user_icon":"https://owlbot.ai/assets/chatbot/user.png",
         "bot_assistant_icon":"https://hrfaciqawmkslnzhtrpe.supabase.co/storage/v1/object/public/public/3c895cd5-1298-4f30-8417-044e2633293c/5ae2b602-bca9-4623-bf51-bf50b055a0c5.png",
         "bot_primary_color":"#FF0000",
         "uuid":[id],
         "owner":test user, 
         "visibility":1,
         "welcome_message":"Welcome Message",
         "bot_input_placeholder":"Type a message",
         "bot_footer_text":"Powered by Owlbot",
         "bot_secondary_color":"#6366F1",
         "PLACEHOLDER_IFRAME_POSITION_BOTTOM":"16px",
         "PLACEHOLDER_IFRAME_POSITION_RIGHT":"16px",
         "PLACEHOLDER_TOOLTIP_WELCOMME_MESSAGE":"Hello ! How can I help you ?",
         "PLACEHOLDER_TOOLTIP_MAIN_COLOR":"#8B5CF6",
         "PLACEHOLDER_TOOGLE_BUTTON_IMG_OPEN":"https://iframe.gptyourdata.ai/assets/logo-white.svg",
         "PLACEHOLDER_TOOGLE_BUTTON_IMG_CLOSE":"https://iframe.gptyourdata.ai/assets/x.svg",
         "js_script_name":null,
         "active":1,
         "word_count":2106,
         "messages_count":37,
         "bot_error_message":"Désolé, je ne comprends pas la question.",
         "doc_count":2,
         "link_count":0,
         "show_doc":0,
         "bot_agent_icon":"https://owlbot.ai/assets/chatbot/agent.png",
         "bot_agent_color":null,
         "secure":0,
         "is_working":0
      },
</code></pre>

[^1]:


---

# Agent Instructions: 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://documentation.owlbot.ai/bot-customisation/chatbot-appearance-and-message.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.