Skip to Content
← Back to all demos

Display Modes

Interactive demo showcasing widget display modes with code examples and smooth animations

Display modesAnimationCode examples

Display Modes Demo

Click the button at the bottom to expand and select a widget mode

Configuration for Sidebar Mode

Chat in a side panel

window.NexusChatWidget.init({
  experienceId: "your-experience-id",
  apiUrl: "{{API_URL}}/v2",
  theme: "light",
  messages: {
    welcomeMessage: "Hello! How can I help you today?"
  },
  embedded: true,
  container: document.getElementById("sidebar-container"),
  window: {
    backgroundColor: "#ffffff",
    borderRadius: "0",
    boxShadow: "none",
    header: {
      show: true,
      title: "Sidebar Chat",
      showCloseButton: false,
      showSizeToggle: false
    }
  }
});