More customisation options

Wishlist AI Chatbot
1
  • Custom background image
  • Custom border radius
  • Custom fonts
  • Custom link styling
  • etc
2 Likes
3

Hi there, @kkaattmmcc and welcome to the Community :wave:

We agree that it would be great to have these options right in the settings and we’ll try to think it over in the future.

As for now you can use the CSS codes to customize the widget:

1. Custom background image


[class*="window__Body"] {
background: url(YOUR_URL);
background-size: cover;
opacity: 1;
}

Do not forget to replace YOUR_URL in the 2nd line of the code with the URL of your image :slightly_smiling_face:


2. Set custom font

.global-styles,
.eapps-ai-chatbot-YOUR_WIDGET_ID-custom-css-root {
  font-family: fantasy;
}

Do not forget to replace YOUR_WIDGET_ID in the 2nd line of the code with the ID of your widget.


3. Change border radius

[class*="window__Container-sc"] {
  border-radius: 0px;
}

4. Change link color

[class*='window__Body-sc'] a {
  color: red; // Link color
}

[class*='window__Body-sc'] a:hover {
  color: red; // Link color on hover
}

[class*='window__Body-sc'] a:active {
  color: red; // Link color when clicked
}

[class*='window__Body-sc'] a:visited {
  color: red; // Link color once visited
}
1 Like