{"id":2885,"date":"2022-03-09T07:12:43","date_gmt":"2022-03-09T07:12:43","guid":{"rendered":"https:\/\/multisite.korebots.com\/agentassist\/?p=1162"},"modified":"2022-03-09T07:12:43","modified_gmt":"2022-03-09T07:12:43","slug":"chat-widget-2","status":"publish","type":"post","link":"https:\/\/multisite.korebots.com\/agentassist\/chat-widget-2\/","title":{"rendered":"Chat Widget"},"content":{"rendered":"

<\/span>Chat Widget Personalization<\/span><\/h3>\n

To modify the overall look, icons and colors of the chat widget an agent is working on, follow these steps:<\/p>\n

1. Navigate to Configuration > Settings > Chat Widget<\/strong>, and click the Chat Widget Personalisation<\/strong> tile.<\/p>\n

\"\"<\/p>\n

2. In the Chat Widget Personalisation<\/b> window, you can configure the following:<\/p>\n

<\/span>General Settings<\/span><\/h4>\n

This option lets you set the widget theme and text font. To configure them, follow these steps:<\/p>\n

    \n
  • Select an option for Theme from the dropdown list to set the widget theme.
    \n\"\"<\/li>\n
  • Select an option for Font<\/b> from the dropdown list to set the text font. The available options include:\n
      \n
    • Arial<\/li>\n
    • Inter<\/li>\n
    • Lato<\/li>\n
    • Sans<\/li>\n<\/ul>\n

      \"\"<\/li>\n<\/ul>\n

      <\/span>Header Design<\/span><\/h4>\n

      This option lets you change the widget\u2019s header appearance. To configure the various options, follow these steps:<\/p>\n

      1. Type in the value for Assistance Name<\/b>.<\/p>\n

      \"\"<\/p>\n

      2. Type the text for Description.<\/p>\n

      \"\"<\/p>\n

      3. Click Upload<\/b> and select an image (.PNG file) to set the logo.<\/p>\n

      \"\"<\/p>\n

      \"\"<\/p>\n

      4. A success confirmation appears when the image is uploaded.<\/p>\n

      \"\"<\/p>\n

      5. Select the colors for Background<\/strong> and Text <\/strong>from their respective selection panels, and click Apply.<\/strong><\/p>\n

      \"\"<\/p>\n

      \"\"<\/p>\n

      6. Select an option for Template <\/strong>to set the header and text appearance.<\/strong><\/p>\n

      \"\"<\/p>\n

      \"\"<\/p>\n

      <\/span>Body Design<\/span><\/h4>\n

      To set the background color and the time of delivery appearance in the chat window, follow these steps:<\/p>\n

      1. Tap the color code that appears below Background Color<\/strong>, select the color, and click Apply<\/strong>.<\/p>\n

      \"\"<\/p>\n

      2. To view the message delivery time, change the option for Do you want to display the time of Delivery? <\/strong>to Yes<\/strong>.<\/p>\n

       <\/p>\n

      \"\"<\/p>\n

      <\/span>User Message<\/span><\/h4>\n

      To set the background and text colors, and the user icon in the user message chat window, follow these steps:<\/p>\n

      1. For Background Color<\/strong>, click the color code tab, select the desired color, and click Apply<\/strong>.<\/p>\n

      \"\"<\/p>\n

      2. To set Text Color<\/strong>, click the color code tab, select the color, and click Apply<\/strong>.<\/p>\n

      \"\"<\/p>\n

      3. To view the user icon set by you, change the Do you want to use User Icon in the chat window? <\/strong>option to Yes<\/strong>.<\/p>\n

      \"\"<\/p>\n

      \"\"<\/p>\n

      4. To update the user icon, click Upload<\/strong>, and select the image.<\/p>\n

      \"\"<\/p>\n

      <\/span>Bot Message<\/span><\/h4>\n

      This feature helps change the background, text, button, and button text colors, and the bot icon in the chat window.<\/p>\n

      To configure Bot Message, follow these steps:<\/p>\n

        \n
      1. Set the Background Color<\/strong>, Text Color<\/strong>, Button color<\/strong>, and Button Text Color <\/strong> To configure these options, follow these steps:<\/li>\n<\/ol>\n
          \n
        • Click the color code tab.<\/li>\n
        • Select the desired color<\/li>\n
        • Click Apply<\/strong>.<\/li>\n<\/ul>\n

          \"\"<\/p>\n

          \"\"<\/p>\n

          \"\"<\/p>\n

          \"\"<\/p>\n

          2. Change the Do you want to use Bot Icon in the chat window? <\/strong>option from No <\/strong>to This will display the bot icon in the chat window.<\/p>\n

          \"\"<\/p>\n

          3. Click Upload <\/strong>and select the image to update the bot icon.<\/p>\n

          \"\"<\/p>\n

          4. After configuring each section, click Save<\/strong>.<\/p>\n

          \"\"<\/p>\n

          5. A success confirmation message is displayed confirming the updates.<\/p>\n

          \"\"<\/p>\n<\/div><\/div>

          <\/div>

          <\/span>Deployment Code<\/span><\/h3>\n

          This feature helps get the instructions and the deployment code for a chat widget on web & mobile. You can whitelist domains to integrate the SmartAssist chat widget with this configuration.<\/p>\n

          To configure the options, follow these steps:<\/p>\n

          1. On the left pane, click Configuration > Settings > Chat Widget<\/strong>, and then, click the Deployment Code<\/strong> tile.<\/p>\n

          \"\"<\/p>\n

          2. In the Deployment Code <\/strong>window, paste the chat widget code in the textbox for Deploy a Chat Widget on your Website.<\/strong><\/p>\n

          \"\"<\/p>\n

          3. Add or delete the domains to be whitelisted.<\/p>\n

          To add the whitelisted domains, follow these steps:<\/p>\n

            \n
          • Under Allowed Domains<\/strong>, click + Add a domain.<\/strong>
            \n\"\"<\/li>\n
          • Type the domain name in the textbox.
            \n\"\"<\/li>\n
          • To delete an existing domain, click the delete<\/b> icon of the entry.
            \n\"\"<\/li>\n<\/ul>\n

            4. Click Save<\/b>.<\/p>\n

            \"\"<\/p>\n

            5. A success confirmation message is displayed after the deployment code update.<\/p>\n

            \"\"<\/p>\n<\/div><\/div><\/div><\/div><\/div><\/div><\/section>\n","protected":false},"excerpt":{"rendered":"Chat Widget Personalization To modify the overall look, icons and colors of the chat widget an agent is working on, follow these steps: 1. Navigate to Configuration > Settings > Chat Widget, and click the Chat Widget Personalisation tile. 2. In the Chat Widget Personalisation window, you can configure the following: General Settings This option...","protected":false},"author":23,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[13],"tags":[],"jetpack_featured_media_url":"","_links":{"self":[{"href":"https:\/\/multisite.korebots.com\/agentassist\/wp-json\/wp\/v2\/posts\/2885"}],"collection":[{"href":"https:\/\/multisite.korebots.com\/agentassist\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/multisite.korebots.com\/agentassist\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/multisite.korebots.com\/agentassist\/wp-json\/wp\/v2\/users\/23"}],"replies":[{"embeddable":true,"href":"https:\/\/multisite.korebots.com\/agentassist\/wp-json\/wp\/v2\/comments?post=2885"}],"version-history":[{"count":0,"href":"https:\/\/multisite.korebots.com\/agentassist\/wp-json\/wp\/v2\/posts\/2885\/revisions"}],"wp:attachment":[{"href":"https:\/\/multisite.korebots.com\/agentassist\/wp-json\/wp\/v2\/media?parent=2885"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/multisite.korebots.com\/agentassist\/wp-json\/wp\/v2\/categories?post=2885"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/multisite.korebots.com\/agentassist\/wp-json\/wp\/v2\/tags?post=2885"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}