# Chatbot Settings

The Chatbot Settings tab gives you full control over the look, feel, and behavior of your chatbot. It also provides installation instructions for deploying on both web and mobile platforms. A live preview widget is displayed on the left to show how the chatbot will appear once deployed.

> Source: https://www.robylon.ai/docs/channels-connectors/chatbot-settings
> Section: Making the chatbot go Live

## Interface

Configure how the chatbot appears on your website or app:

* **Display modes**:
  * **Widget** (floating chat bubble)
  * **Popover** (overlay)
  * **Embed** (inline section)
* **Positioning**: Control widget alignment, side spacing, and bottom spacing.
* **Toggles**:
  * **Stream Text** — Visually stream text as it’s generated.
  * **Voice Input** — Allow users to speak via speech-to-text.
  * **Voice Output** — Use text-to-speech so the bot can talk.

***

## Styles

Personalize the chatbot to match your brand:

* **Text & Labels**: Set chatbot **title** and **subtitle**.
* **Colors**: Choose **brand color** and **title-bar color**.
* **Images**:
  * Widget icon
  * Agent avatar
  * Header image
* **Banner & Text**:
  * Show a **welcome banner** with image and text
  * Customize **footer text**
  * Set a **message box placeholder**
  * Optionally include a **“Powered by Robylon”** link

***

## General Settings

Adjust chatbot behaviors:

* **Play sound** when a new message arrives
* **Show AI indicator** for AI-generated replies
* Allow users to **rate messages**

***

## Content

Define chatbot display logic and conversation memory:

* **Custom conditions** — control when the chatbot appears
* **Delay** — set a delay before chatbot pops up
* **Conversation history** — enable to let users view past chats

When **conversation history** is enabled, you can also configure additional visual and branding elements for the chatbot experience, such as:

* **Chatbot home page banner**\
  You can set a welcoming banner that appears when users open the chatbot home page. This banner can display a custom image and message, creating a branded experience and helping guide users as they revisit previous conversations.
* **Logo, heading, and subheading for the home page**\
  You can add your company logo and define a heading with a short subheading to reinforce your brand identity. The heading introduces the chatbot’s purpose, while the subheading provides helpful context or instructions, making the home page look professional and user-friendly.

### Chatbot Home Page Banner

* Add a **banner image** that appears at the top of the chatbot’s home screen.
* Use this to highlight **brand identity**, share **seasonal campaigns**, or provide a **welcome graphic**.
* Recommended size: ensure it is optimized for both desktop and mobile screens.

### Logo, Heading, and Subheading

* **Logo** — Place your company or product logo prominently to reinforce trust and brand recognition.
* **Heading** — Add a short, clear title (e.g., *Welcome to Robylon Support*).
* **Subheading** — Provide a short description or guidance (e.g., *Ask me about your orders, subscriptions, or policies*).

Together, these elements help frame the chatbot as a **branded, helpful entry point**—especially important when users are reviewing past conversations or starting new ones.

***

## Installation

Find integration instructions for deploying the chatbot.

### Web Applications

Supports installation on:

* **JavaScript**
* **React**
* **Webflow**
* **WordPress**
* **Bubble**
* **Framer**
* **Wix**
* **Shopify**

### Mobile Applications

Supports installation on:

* **Android**
* **iOS**
* **React Native**

<Note>
  Follow the framework-specific instructions provided to ensure smooth setup and compatibility.
</Note>

***