Customization of the AI Chatbot text

Ask the Community Customization
1

I want to change the text color of the assistant it self. Its now black i want it to be #667079

2

And maybe the overal fontsize a bit smaller

3

Try adding this CSS:

/* Style assistant’s message text */
.es-message-assistant .es-message-content-container p {
color: #667079 !important;
font-size: 80% !important;
}

The 80% means 80% of the default font size. Change that to your preference. :+1:

4

Yeah great thats working fine. Aldo i have a problem that the Chat bot is not working this morning. I already have a chat with you guys and there is a problem at you site with the app. Hopefully it will be fix soon. I put mine off for now because the customer gets no result when ask a question

5

Now the assistant is oke but can it be also done for the iput block were customer write there text in that also black and bigger? My whole site have these textcolor #667079 and some smaller size.
Perhaps a overal tex size also for the customer balloons (aldo that font is white)

6

the customer balloon text size i made it my self thats done exept die input must be smaller and not black

1 Like
7

I mean the window were you type your message in before sending. Thats also black and biger size like i want to

1 Like
8

In your Chatbot App, there is a ‘Theme’ tab where you can change the colors of the box. I also posted about changing the size of the box for Mobile here: https://community.elfsight.com/t/change-the-size-of-ai-chatbots-window-size-mobile-only/109347/

1 Like
9

Hi there, @paintproductions :waving_hand:

Do you mean the placeholder text in the input field?

image
image451×720 20 KB

If this is the case, here is a CSS code to change its size and color :slightly_smiling_face:

[class*="TextControlBase__TextControlBasePlaceholder-sc"] {
  color: black!important;
  font-size: 15px;
}
1 Like