Skip to main content

Settings

Embedding your AI Assistant as a widget on your website not only enhances user experience but also provides a seamless way to maintain your brand's aesthetic. This guide will walk you through each step of configuring your widget, ensuring it aligns perfectly with your brand.

Title and Subtitle​

  • Title (Required): This is the name that appears at the top of your chat widget. It's often the first thing your visitors will see, so choose a title that reflects the purpose of your AI Assistant or your brand name.
  • Subtitle (Optional): This text appears just below the title and offers additional context or a friendly greeting to visitors. It's a great place for a catchy phrase or a brief description of what your assistant can do.

Conversational Interface​

  • Input Text Field Placeholder: Here, you can define the placeholder text that appears in the message input field. Use it to prompt visitors to ask questions or start a conversation, such as "Ask me anything..."
  • Initial Text: This is the first message users receive when they open the chat. It's your AI Assistant's chance to make a great first impression, so consider including a warm welcome message or a quick guide on how to use the assistant.

Visual Customization​

  • Profile Avatar: Set a public image URL to represent your AI Assistant visually. This could be your brand logo or a character that represents your service. It personalizes the chat experience and makes it more engaging.
  • Open Launcher Image: Customize the chat launcher icon with an image URL. This replaces the default chat bubble icon, allowing you to use a design that matches your website's theme or branding.
  • Main Color: Select the primary color for your chat widget. This color will be used for the chat header and other key elements, enabling you to match it with your brand's color scheme.
  • User Background Color: Customize the background color of the messages sent by users. This helps distinguish between the user's messages and the assistant's responses, enhancing readability.

Advanced Settings​

  • AI Assistant Exposure (%): Control how often the chat widget appears to visitors. For instance, setting it to 20% means only one in five visitors will see the chatbot initially. This can be useful for testing its impact or managing how interactive you want your site to be. Once an user sees the assistant on your webpage, they will see it always.
info

See the incremental release strategy guide

This setting is helpful to incrementally test the AI Assistant in front of your users. You can set it to 20% and see how users interact with your assistant then improve it for others. Once you are satisfied with the assistant's responses, you can increase this to 50% and repeat the process until you set it to 100% (meaning that all users will see it).

Important note: You can set it to 0% and test it by adding in the url ?test-cbo=1. For example, if your website is https://mywebsite.com, you can access your assistant by https://mywebsite.com?test-cbo=1 and only you will be able to interact with the assistant via your website.

  • Show Full-Screen Button: Decide whether to include a button that allows users to expand the chat widget to full screen. It's useful for more complex interactions or when you want to offer users an immersive chat experience.
  • Display "Powered By Cubeo": Toggle whether to show the widget branding. Note: Removing this branding may require upgrading your subscription plan.

Saving Your Settings​

Once you've configured the settings to your liking, don’t forget to save. Click the "Save" button to apply your changes. If you're planning to make the widget live, make sure to test the chat functionality and appearance on your site to ensure everything works as expected.

By customizing your AI Assistant widget according to these steps, you'll ensure that it not only provides valuable assistance to your users but also seamlessly integrates with your site's design and branding.