# STEP 3: Look & Feel

1. **General settings** - just add the name of your Project here. Below you can see the place, where the "Bot name" will be displayed, you can also enter the name of your company here:

![](/files/L4SL6WEzFPujsqKyHUGY)

<mark style="color:orange;">**Remember:**</mark> always save your changes by clicking <mark style="color:green;">**SAVE**</mark> at the top of the screen! You will be able to view your changes immediately in the view on the right.

**2.** **Look** - this is where you set the color of the widget, the display location or add your logo.

![](/files/3JTVAVtVCsOC7o02688b)

<mark style="color:orange;">**Remember:**</mark> always save your changes by clicking <mark style="color:green;">**SAVE**</mark> at the top of the screen! You will be able to view your changes immediately in the view on the right.

**3. Get code** - once you've gone through the most important settings, it’s time to add the Widget to        your website. We've made it easy for you. The only thing you need is to paste the embed code  according to the instructions below. That's it!

![](/files/3XqD2Llnuj6MqFDVMbAN)

<mark style="color:orange;">**Remember:**</mark> always save your changes by clicking <mark style="color:green;">**SAVE**</mark> at the top of the screen! You will be able to view your changes immediately in the view on the right.

<mark style="color:yellow;">**TIP**</mark> Send this instruction to your web specialist,  if you haven’t  worked with the HTML yet.

After refreshing the page (sometimes it is also necessary to clear the cache) the Lead-o-Mat widget will appear immediately according to your settings. From now on, your customers will have their own assistant!

**4. CSS settings** - if you need more style settings you can use the editor. We have listed the most important variables so that you can adjust your widget even more precisely.

![](/files/00Zi4xKjfkCYBcIandJs)

<mark style="color:orange;">**Remember:**</mark> always save your changes by clicking <mark style="color:green;">**SAVE**</mark> at the top of the screen! You will be able to view your changes immediately in the view on the right.

**5.** **Labels** - here you will find the button settings that we use in the widget

![](/files/Ho9fUnsReFmB01sVVNzu)

<mark style="color:orange;">**Remember:**</mark> always save your changes by clicking <mark style="color:green;">**SAVE**</mark> at the top of the screen! You will be able to view your changes immediately in the view on the right.

**6. Advanced** - here you can delete your project. Remember that a deleted project cannot be recovered. Be careful and think through your decision.

![](/files/SmE2fdIeE4WDtBIqJWJT)

**Examples of user interface / widgets:**

In the user interface, a text input field enables asking manual questions, presents a list of most popular questions and also related topics. It handles misspellings and grammar errors as well. If it is unable to answer the question it provides a “don’t know” message and gives one the ability to rephrase your question or connect to the Live Chat operator for further assistance.

| ![](/files/k3pxHweL0hIWwG5eceFn) | ![](/files/RpVKLjep2jcrFzExoCsl) |
| -------------------------------- | -------------------------------- |
| ![](/files/jeW6xAbQqwjzw1QSD45c) | ![](/files/3Lyr9PTczsmPmrApRIp8) |


---

# 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://help.inteliwise.com/chatbot/how-to-set-up-your-chatbot/step-3-look-and-feel.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.
