View Chat Widget Appearance via API

Markdown

View as Markdown

View Chat Widget Appearance via API

Use this endpoint to retrieve the current appearance settings of a chat widget for a specific Chat Agent. This is useful if you want to:

  • Preview how the widget looks.

  • Sync appearance settings with another system.

  • Debug or audit current styling and branding.


Endpoint Overview

Method: GET
URL:

https://app.floraai.me/en/chatbot/api/v1/chatwidget/{chatbot_uuid}/appearance/view/

Replace {chatbot_uuid} with the unique identifier of your chatbot.

Example:

https://app.floraai.me/en/chatbot/api/v1/chatwidget/123e4567-e89b-12d3-a456-426614174000/appearance/view/

Authentication & Headers

This endpoint requires token-based authentication.

Required headers:

Content-Type: application/jsonAuthorization: Token <Your-API-Token>

Optionally, you can also include:

Accept: application/json

Request Example (Python)

Below is a minimal example using Python’s requests library to fetch the chat widget appearance:

import requestschatbot_uuid = "<YOUR-CHATBOT-UUID>"base_url = "https://app.floraai.me"endpoint = f"/en/chatbot/api/v1/chatwidget/{chatbot_uuid}/appearance/view/"url = base_url + endpointheaders = {    "Authorization": "Token <YOUR-API-TOKEN>",    "Content-Type": "application/json",    "Accept": "application/json",}response = requests.get(url, headers=headers)if response.status_code in (200, 201, 202):    result = response.json()    print("Response data:", result)else:    try:        error_data = response.json()        error_message = error_data.get("message") or error_data.get("error", "Unknown error")        print(f"Error: {error_message}")    except ValueError:        print(f"Error: Status code {response.status_code}")

Key points:

  • Ensure you use the full endpoint including /appearance/view/.

  • Replace <YOUR-API-TOKEN> and <YOUR-CHATBOT-UUID> with your actual values.

  • A successful request returns status code 200 and a JSON body with all appearance settings.


Response Example

A successful response returns a JSON object describing all appearance-related properties of the chat widget:

{  "chat_bubble_img": "https://example.com/chat-bubble.png",  "chat_bubble_color": "#0000FF",  "chat_avatar_image": "https://example.com/chat-avatar.png",  "user_msg_avatar_image": "https://example.com/user-msg-avatar.png",  "icon": "https://example.com/icon.png",  "send_msg_button_image": "https://example.com/send.png",  "widget_bg_image": "https://example.com/widget-bg.png",  "widget_header_banner_image": "https://example.com/widget-header-banner.png",  "header_gradient_color_1": "#0061f2",  "header_gradient_color_2": "#d9dbdf",  "font_family": "system-ui",  "font_size": 16,  "widget_bg_color": "#fafafa",  "user_message_bg_color": "#DAE7FB",  "ai_message_bg_color": "#E0E5EC",  "subheading": "How can I help you today?",  "tagline": "Powered by Stammer",  "enable_response_typing_simulation": true,  "response_typing_speed": 10,  "widget_border_width": 1,  "size_of_widget": "medium",  "chatwidget_title_text_color": "#FFFFFF",  "user_msg_text_color": "#222222",  "ai_msg_text_color": "#222222",  "chat_input_text_color": "#222222",  "widget_border_color": "#e0e5ec",  "widget_input_bg_color": "#fafafa",  "hyperlink_color": "#0964f1",  "show_tagline": true,  "tagline_color": "#d9dbdf",  "chat_input_placeholder": "Type your message...",  "widget_bg_preference": "color",  "enable_ai_agent_status_messages": true,  "ai_agent_status_messages": "Online\nTyping...",  "use_icon_image_as_avatar": false}

Field Reference

Below is a brief description of the main fields returned:

Images & Icons

  • chatbubbleimg: URL of the floating chat bubble icon.

  • chatavatarimage: URL of the AI/chatbot avatar image.

  • usermsgavatar_image: URL of the user’s avatar image (if shown).

  • icon: URL of the main widget icon (can be used in the launcher or header).

  • sendmsgbutton_image: URL of the send button icon.

  • widgetbgimage: URL of the background image for the widget body.

  • widgetheaderbanner_image: URL of the header/banner image.

Colors & Styling

  • chatbubblecolor: Background color of the chat bubble (launcher).

  • headergradientcolor1, headergradientcolor2: Gradient colors for the widget header.

  • widgetbgcolor: Background color of the widget body (used if widget_bg_preference is color).

  • usermessagebg_color: Background color for user messages.

  • aimessagebg_color: Background color for AI messages.

  • chatwidgettitletext_color: Text color for the widget title.

  • usermsgtext_color: Text color for user messages.

  • aimsgtext_color: Text color for AI messages.

  • chatinputtext_color: Text color inside the input field.

  • widgetbordercolor: Color of the widget border.

  • widgetinputbg_color: Background color of the input area.

  • hyperlink_color: Color used for links in messages.

  • tagline_color: Text color for the tagline.

Typography & Layout

  • font_family: Font family used in the widget (e.g., system-ui).

  • font_size: Base font size (numeric, typically in px).

  • widgetborderwidth: Width of the widget border (numeric).

  • sizeofwidget: Overall widget size (e.g., small, medium, large).

Text & Labels

  • subheading: Subtitle or helper text shown in the widget header or welcome area.

  • tagline: Short tagline text (e.g., “Powered by …”).

  • chatinputplaceholder: Placeholder text in the message input field.

Behavior & Preferences

  • enableresponsetyping_simulation: Whether to simulate typing before AI responses.

  • responsetypingspeed: Speed of typing simulation (higher values usually mean faster).

  • widgetbgpreference: Background preference, e.g., color or image.

  • show_tagline: Whether the tagline is displayed.

  • enableaiagentstatusmessages: Whether AI status messages are shown (e.g., “Online”, “Typing…”).

  • aiagentstatus_messages: Status messages text, separated by line breaks.

  • useiconimageasavatar: If true, the icon image is also used as the avatar.


Common Issues & Tips

  • 401 Unauthorized: Check that your Authorization header is correctly set and the token is valid.

  • 404 Not Found: Verify that the chatbot_uuid is correct and that the chatbot exists.

  • Incorrect URL: Ensure you are calling the full endpoint including /appearance/view/ and not just the base URL.

Use the returned JSON to render or debug your chat widget’s appearance in your own applications or to confirm that configuration changes have been applied correctly.

Was this article helpful?

Still need help?

Contact us