How To Style Your Smith.ai Chat Widget

Updated 1 month ago by Kelsey Johnson

How to style your widget

  1. In your dashboard, click on the settings gear:
  1. Click on “Widget” next to “Account” and “Business Info”
  1. Scroll down and click on “Style”
  1. From there, you can style your widget:
    1. Color (requires the hex code of your color):
    2. Button type (just the icon, or with the word "chat" next to it):
    3. Title and intro:
    4. Upload your logo:
      1. Check out the size of your logo and change or remove it
  2. Don't forget to save! Here's how your widget should look after you update your color, button type, logo, title, and intro (this example also has a disclaimer):
These options affect the way that your widget looks, but the text will not appear in any of the chat responses. Live agents will respond to chats using details collected from your startup form. If enabled and programmed, your chatbot will answer chats using your knowledge base.

How to require a phone number to initiate chats

In addition to requiring a name and email to initiate chat, you have the option to request a phone number too. You could use this number to call someone who left a chat early, or reduce the amount of contact information you need to collect later. Here's how to set it up:

  1. If you're not already there, go to Settings > Widget > Style in your chat dashboard.
  2. Beneath "Visitor Info" you can require a phone number before the chat begins. Click on the toggle to turn it on and then confirm the change.
  1. That's it! Your info fields should now include Name, Email, and Phone:


How did we do?


Powered by HelpDocs