MiniChat Widget Integration

Configuration Options

Customize the MiniChat widget using the options below. Changes will be applied immediately and the code will update in real-time.

Button Position:

Button Color:

Button Icon:

Container Color:

Button Size:

Z-Index:

Error Timeout (ms):

Chat URL

Enable Debug Mode

Enable Fullscreen Mode

Configuration Code

<script src="https://minichat-widget.bayonai.com/embed.js" 
  data-chat-url="https://wonder.bayonai.com/chat/applet?personaId=sol"
  data-position="bottom-right"
  data-button-color="#4a6cf7"
  data-button-icon="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 24 24'%3E%3Cpath d='M20 2H4c-1.1 0-2 .9-2 2v18l4-4h14c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm0 14H5.17L4 17.17V4h16v12z'/%3E%3C/svg%3E"
  data-container-color="#ffffff"
  data-size="medium"
  data-z-index="9999"
  data-debug="false"
  data-enable-fullscreen="false"
  data-error-timeout="8000">
</script>

Advanced Integration

For more control, use the advanced integration method:

<script>
(function(w,d,s,o){
  w.MiniChat=w.MiniChat||function(){(w.MiniChat.q=w.MiniChat.q||[]).push(arguments)};
  var js=d.createElement(s),fjs=d.getElementsByTagName(s)[0];
  js.id='minichat-js';js.src='https://cdn.minichat.com/chat.js';js.async=1;
  fjs.parentNode.insertBefore(js,fjs);
  w.MiniChat('init', { 
    siteKey: 'YOUR_SITE_KEY', 
    theme: 'light',
    position: 'bottom-right',
    welcomeMessage: 'How can we help you today?'
  });
})(window,document,'script');
</script>