UI Customization

The UI tab allows you to personalize the look and feel of your assistant’s interface and website widget.
You can customize the background, colors, widget position, and chat button label — and if your assistant is live, you can integrate it directly into your website.

Background Settings

You can choose how your assistant’s background appears during interactions.

Background Type

Select between:

• Solid Color – Choose a flat background color for your assistant interface.
• Image – Upload a custom background image (up to 3 MB) to create a more immersive look.

Background Color

If you select a solid color, click the color box to open the color picker and choose your preferred color (e.g., #f5f5f5).

Widget Settings

The widget controls how your assistant appears when embedded on a website.

Button Label

Set the text that appears on the chat button (e.g., “Chat with us,” “Ask Ziddny,” or “Need Help?”).
This helps align your assistant’s tone with your brand’s style.

Widget Position

Choose where the widget will appear on your site:

• Bottom Right
• Bottom Left
• Top Right
• Top Left

Website Integration

Once your assistant is live, published, and public, a website integration script becomes available at the bottom of this page.

Copy and paste this script into your website’s HTML to display your assistant widget.
Example:

<!-- Ziddny Assistant Widget -->
<script>
  window.ZiddnyAssistant = {
    assistantId: "live_xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx"
  };
</script>