Adjusting appearances for the Embed chat interface:

Here you will be able to adjust the appearances of the Embed  output like colorography, typography, background  etc.

• General
  1. Text: Use this to configure the typography like; Font, Font size and Font weight (bold or regular)
  2. Settings: Use this to show/hide the progress bar, you can also set the color of the progress bar
  3. Progress bar is shown to user when they interact with chat interface, and it progresses based on number of questions answered out of all.
  4. Chat branding: Use this to show/hide the WeConnect.chat branding on footer of the Embed chat interface.
  5. Embed background: Use this to set the background of Embed. There are two types of backgrounds are available. Like, Solid color & gradient color as a background. 
  6. Default: Use default button to reset the default colors and appearances settings.

• Chat
  1. Chat style -> Message Bubble: Use this to change the shape of component output.
  2. Chat style -> Chatbox: Use this to adjust color appearances of component output.
     1. Solid color: Use this to set the solid color of the component
     2. Gradient color: Use this to set the gradient color of the component
     3. Text color: Use this to set the solid color of the text displayed on component
     4. Typing color: Use this to set the color of typing animation
  3. Opacity: Use this to adjust the opacity of landing page. Use slider to set opacity as per your need. 
  4. Chat style -> User response message:
     1. Background color: This will set the background color of the user response 
     2. Text color: This will set the text color for the user response
  5. Chat style -> Button style: This is to configure the appearances of buttons shown in output. Buttons are shown in some specific components like, multiple choice, carousel etc.
     1. Button Radius: This will set the corners of a button. Use this to show circular buttons like oval or rectangular shape.
     2. Button border color: This will set the border color of button
     3. Button background color: This will set the background color of button
     4. Button Text color: Use this to set the text color of the button.
  6. Profile picture & avatar:
     1. Profile picture: Use this to apply the picture (logo) to be shown in the Embed.
     2. Avatar: This is the picture shown near question when it appears on output. You can upload your own avatar image or use from some options available.
     3. Image scale: Use this to change the scale of avatar and profile pic. This is helpful to make image either round or square.