For Developers
Web Chat
Embedding Web Chat
Full Screen Bot

Full Screen Chatbot

Styling Webchat

You can Customize the Chatbot to be Full Screen by default using below CSS

// Import the Botpress WebChat JavaScript file
<script src=""></script>
// Initialize the Botpress WebChat with the required parameters
        // Replace <your-bot-id> and <your-client-id> with your actual bot and client IDs
        "botId": "<your-bot-id>",
        "clientId": "<your-client-id>",
        // Set the URL for the Botpress WebChat JavaScript file and the messaging server
        "hostUrl": "",
        "messagingUrl": "",
        // Set the name of the bot that will be displayed in the WebChat interface
        "botName": "Test",
        // Set the width of the WebChat container and layout to 100% (Full Screen)
        "containerWidth": "100%25",
        "layoutWidth": "100%25",
        // Hide the widget and disable animations
        "hideWidget": true,
        "disableAnimations": true,
    // Opens up the Chatbot by default
    // This lets users start chatting with the Chatbot without needing to click any buttons or menus.
        function () {
            window.botpressWebChat.sendEvent({ type: "show" });