AlcmeonChat, Alcmeon's white-label chat solution, offers customization options to align with your brand identity: the button that launches the chat, the call-to-action message bubbles, the chat widget itself, and even the notification emails your customers receive when an agent responds to their request.

Access the Customization Interface

To customize the appearance and text of your Alcmeonchat widget, go to the “Settings / Accounts” section, navigate to your specific AlcmeonChat account page witin Alcmeon and click on the “ Chat Demo ” link.

In the window that opens, click the “Customize” button. This will open the customization window, which is organized into 4 tabs that we will detail below:

• Closed chat
• Chat Header
• Cat Conversation
• Generate the Code

Closed chat

This section allows you to customize the appearance of the AlcmeonChat widget when it is closed.

➡️

Background image

This image is used only within your Alcmeon environment for preview purposes as you configure other AlcmeonChat components. We recommend uploading a 1680x1024px image in JPG or PNG format.

Launch button

You can change the appearance and the positioning on the page of the AlcmeonChat launch button.

• Change the button appearance by uploading your own image or logo
  • Format: PNG
  • Size: 64x64px
• Change the button position on your website page
  • Bottom right (default position)
  • Bottom left corner
  • Top right corner
  • Top left corner
• Enable chat widget drag and drop (Desktop only)
  • Activating this option allows your customers to freely reposition the chat module anywhere within your website page
• Enable notifications of new messages from the advisor
  • This feature displays a bubble on your launch button icon whenever an advisor has responded to the customer.
  • You can change the color of this bubble, when this feature is active.

Help messages

Help messages are the automatic message bubbles that appear when you close AlcmeonChat. You can fully customize their content and determine whether they should be displayed in one of two cases: if no conversation has been started, or if a conversation is already in progress.

New Conversation Assistant: These message bubbles automatically appear after 5 seconds and disappear after 10 seconds when no conversation is currently in progress.

Ongoing Conversation Assistant: When a conversation is already underway, these message bubbles appear continuously until the customer manually closes them. 

In both cases, you can display up to two messages.

Chat Header

This section allows you to customize the content and appearance of the top portion of your open chat widget.

➡️

Logo displayed top left

• Format: PNG (with a transparent background)
• Size: 70x70px

Title

• Choose whether to show or hide the title 
• Enter your desired text for the header title
• Use the color picker to select the text color

Subtitle

• Choose whether to show or hide the subtitle
• Enter your desired text for the header subtitle
• Use the color picker to select the text color

Link to your privacy policy

• Choose whether to show or hide this link
• Customize the text that appears before the link
• Customize the clickable text 
• Set the URL

Note: Your privacy policy is often displayed at the beginning of your bot scenario. There's generally no need to show it a second time in the chat header, unless you specifically want it to remain persistently visible throughout the conversation.

Chat Conversation

In this tab, you can customize elements of the conversation interface, including message and icon colors, as well as texts displayed to the client.

➡️

Logo to the left of your brand's answers

• Choose whether to show or hide it
• Format: PNG (with a transparent background)
• Size: 40x40px

Primary color

• Customize the color using a color picker
• It will be used for: progress bar, buttons, menu items and icon hover state.

Secondary color

• Customize the color using a color picker
• It will be used for: the background color of menu items and hovered or active buttons.

Other colors

• Customer message text
• Customer message bubble background

Texts

You can edit or translate the following texts that appear in the interface:

• The prompt "Type your message here"
• The "Select an option above" prompt, which appears when your bot scenario requires the customer to click a button and does not allow free text input at that step.
• The text prompting the customer to enter a phone number as part of the SMS notification process in your bot scenario.
• The text prompting the customer to enter an email address as part of the email notification process in your bot scenario.

Generate the code

This final tab allows you to configure the language for AlcmeonChat. While many text elements are customizable, some are translated by default.

In this tab, you can:

• Set the default language for AlcmeonChat.
• Generate the JavaScript code you need to insert onto the pages of your website where you want the AlcmeonChat to appear.

If the JavaScript code has already been installed on your site, the visual changes will be automatically updated.

However, for text changes, you will need to regenerate the JavaScript code and re-install it for those changes to take effect.

💡Note: If your website has multiple language versions, the generated file will need to be duplicated and you must modify the values of the following fields to match the desired language:

• langCode (possible values: it, fr, en, sp, de)
• title (AlcmeonChat title in header)
• subtitle (AlcmeonChat subtitle in header)
• privacy_link_label (link text)
• privacy_link_prefix (text before link)
• helperMessage1 (first message bubble in case of an unstarted conversation)
• helperMessage2 (second message bubble in case of an unstarted conversation)
• helperMessage3 (first message bubble in case of an already started conversation)
• helperMessage4 (second message bubble in case of an already started conversation)
• send_your_email (Invitation to enter an email address)
• send_your_phone (Prompt to enter a phone number)
• send_a_message (Prompt for a message)
• select_an_option (Prompts to select an option from a menu)