Customizing the manual teaser

Learn about the different behaviour options of the manual teaser

If a chat widget teaser is created manually in the moinAI Hub Preview and added on a website using code instead of adding it via the teaser management in the Hub, the following adjustments can be made to the behaviour of the teaser. The chat widget provides a JS API function that provides control options described in the technical documentation.

Recommendation: Teasers should be created and adjusted using Teaser Management in the moinAI Hub. The manual teaser is outdated.

Time-delayed Playout

A time-delayed playout of the teaser can optionally be stored in the code in milliseconds via the value "timeout:". In the example, it is two seconds.

<script>

//ChatWidgetReady function signals that the script is fully operational

//this function is called when the client side api can be accessed


var chatWidgetReady = function() {

     //place your own logic in this function.

     //example for teaser

     window.knowhere.api.teaser({

       showTeaser: true,

       showAvatar: true,

      message: 'How can I help you?',

       quickActions: [{

          text: 'Ask question',

           intent: 'start'

         },

         {

          text: 'Example Intent',

          intent: 'faq_example'

         }

       ], timeout: 2000

     });

}

</script>

 

Hide Teaser on Mobile Devices

To enable the teaser to be played out on the desktop only, a rule can be set so that the teaser script is only played for certain screen sizes, for example.

This can be done, for example, using media queries or screen resolution tags in the Google Tag Manager. The exact implementation depends on the technical website environment.

Hide Teaser Message or Action Buttons

When creating the teaser, the teaser message can be left blank to hide this element. If a teaser message without action buttons should be played instead, this can be defined in the integration code. You can find the details in the technical documentation.

Hide Avatar

See technical documentation

       showAvatar: false

true = Avatar is above the widget icon. Only when a teaser is active.
false = No avatar above the widget icon. Only when a teaser is active.

Remember Teaser Closure

The teaser will no longer be displayed if users have interacted with the action buttons or opened the chat widget directly. If the user clicks the close-X button, the teaser is hidden and reappears when the page is reloaded. This behavior is the recommended default.


If needed, this behaviour of all teasers can be changed in the Widget & Teaser menu under Widget Display. There you will find a section Remember Widget Usage in the lower section.

If user data storage is allowed, the active closing of a teaser by a user can be remembered. To do this, select the duration for which the closing of the teaser is to be remembered. The user will not be shown a teaser again for this duration.

Bildschirmfoto 2022-09-13 um 11.23.21-1