Floating widget customization (Arcade and Modern widget)

Customizing the Look & Feel

  1. In the AI Console, go to Touchpoints > Widgets.
  2. Click Personalize under Floating Widget.
  3. Select a knowledge base or URL to customize.
  4. On the Basics tab, you have the following options:
    • Widget color customization: click on the colored box next to Primary color and select the color you want.
    • Expanded widget title text customization (the widget after mouse over): change the text shown in the Title field.
    • Minimized widget title text (the widget before mouse over): change the text ("Have a Question?") shown next to the Title (minimized) field.
    • For dock position (Where the widget is placed on the page): click Customize next to the Dock Position field. Default docking is left positioning; you can change it to be poisoned right.
    • For Custom CSS: to modify the CSS for the widget insert the CSS code in the Custom CSS box.
    • Decoration image:
      • Decoration image: select an image from library or add an image URL.
      • Image position: define the position of the back image.
      • Widget back image question on click: Auto question which appears if clicking on the decoration image.
      • Widget back image timeout (milliseconds): Time to show widget. Set in milliseconds and removes the image when the time is up. If the time is 0, the image will not disappear.

Customizing Default Text

  1. In the AI Console, go to Touchpoints > Widgets.
  2. Click Personalize under Floating Widget.
  3. Select a knowledge base or URL to customize.
  4. On the Texts & Colors tab, you have the following options:
    • Search box initial text: change the text in the Search box initial text field.
    • 'No results' text customization: change the text in the No Results message field.

Customizing Fonts & Colors

  1. In the AI Console, go to Touchpoints > Widgets.
  2. Click Personalize under Floating Widget.
  3. Select a knowledge base or URL to customize.
  4. On the Texts & Colors tab, you can change the fonts and colors of the following widget elements:
    • title
    • answer text
    • answer title
    • links (colors only)

Customizing Position & Size

  1. In the AI Console, go to Touchpoints > Widgets.
  2. Click Personalize under Floating Widget.
  3. Select a knowledge base or URL to customize.
  4. On the Position & Size tab, you have the following options:
    • Bottom margin: fill in the distance in px from the bottom of the window
    • Side margin: fill in the distance in px from the side of the window (default is 10px)
    • Minimized width: adjust the widget's width when minimized (before mouse over)
    • Expand on rollover: select to make the widget expand when the customer moves the mouse over the widget. If not selected, the widget expands only on click.
    • Float auto-minimize timeout: enter the time the widget is expanded from page load until it becomes minimized. If the time is not 0 then mark the next field as well.
    • Expand on page load: select to make the widget expand when the page loads. If not selected, the widget expands when the page loads.

Advanced Customization

  1. In the AI Console, go to Touchpoints > Widgets.
  2. Click Personalize under Floating Widget.
  3. Select a knowledge base or URL to customize.
  4. On the Advanced tab, you have the following options:
    • Auto-Label tickets (IDs) first, choose the relevant URL in the URL combo box. Then, select the label to be attached to a ticket from the URL.
    • Append footer to answers add text below the answers. Suitable for campaigns or notifications you want to promote to your customers. The text can include a "HTML" as well.
    • Append once after results: when more than one answer is suggested, the text will only be added below the last suggestion.
    • Widget enabled: mark / unmark it to show or hide the widget.
    • Mobile widget enabled: Check / uncheck it to show or hide the floating widget on mobile phones.