How to have a full width webchat on website
# 🤝helpa
adventurous-glass-22349
07/24/2023, 4:28 PMHi is there a way to embed the bod into a website page as full page width NOT as a chatbot. Asking as the chatbot is not currently responsive so a full page embed will be a workaround for now. Your botpress integration screen is full page width. How do we do this on a website in Wordpress thanks
f
famous-jewelry-85388
07/24/2023, 4:43 PMHi,
Did you try this: https://botpress.com/docs/cloud/webchat-customization/full-screen-bot/
a
adventurous-glass-22349
07/24/2023, 4:44 PMIn the docs it says you can set this in. CSS?? Is this for cloud or v12. This is the only change I want to make. I don’t want to change any other styling?
adventurous-glass-22349
07/24/2023, 4:44 PMIt’s a cloud bot. If I add the full screen CSS file to the cloud integration will this worK
adventurous-glass-22349
07/24/2023, 4:46 PMLet me try again…is this a new CSS file/JS script…where does it go? I need it on a Wordpress page
adventurous-glass-22349
07/24/2023, 4:49 PMThere is no bot or client ID in the botpress studio cloud? Are you sure this is for cloud?
adventurous-glass-22349
07/24/2023, 5:04 PMActually that all works yay - apart from its very full screen. Its enough for a quick workaround.
What does this do as it also says 25%
// Set the width of the WebChat container and layout to 100% (Full Screen)
"containerWidth": "100%25",
"layoutWidth": "100%25",
f
famous-jewelry-85388
07/24/2023, 5:05 PMThe styler bot creates the file and hosts it for you.
famous-jewelry-85388
07/24/2023, 5:06 PMBut I am happy that it worked for you 🙂
famous-jewelry-85388
07/24/2023, 5:06 PMHappy bot building 🚀
a
adventurous-glass-22349
07/24/2023, 5:45 PMAnyway to use this file to set a border radius on the chatbot bubble boxes? Ive made this mobile responsive now but it seems you have to create a whole CSS file to change 1 or 2 parameters in the bot style? Thanks
f
famous-jewelry-85388
07/25/2023, 8:36 PMI think yes
2 Views