Hi guys. I am trying to embed my bot into a webpage. It works fine as a button you click on to open the chat widget. I am using WordPress with Elementor Have created a page and added the iframe code from https://botpress.com/docs/cloud/webchat-customization/bot-in-div/ It is showing the chatbox BUT only title bar and bottom bar (where user inputs) = middle bit is missing. Any ideas what might be wrong? Thanks. David

I am using the same website set up and have an embedded bot at the following url. https://boutiquebeachretreat.com/faq-embedded-chatbot-demo/ I used code I pulled from inside Botpress and didn't need an iframe. From the botpress dashboard click on chat in the main navigation and then right-click, inspect code near the top of the chat window that is displayed on the page, I recall having to tweak the code slightly and remove some divs to get it to display correctly but it was fairly easy to do.

Nicely done 🙌

Great, that's exactly what Im looking for. I tried pulling the code from the place you said and still not showing up correctly 😢

@adamant-dinner-92616 would you mind sharing how you solved this issue? My bot shows only top and bottom , no Middle thanks 🙏

This is the code I used with my personal data ######## out <iframe style="border: none;" srcdoc=" window.botpressWebChat.init({ 'composerPlaceholder': 'Type.......', 'botConversationDescription': '####################', 'botName': '##################', 'botId': '############################', 'hostUrl': 'https://cdn.botpress.cloud/webchat/v0', 'messagingUrl': 'https://messaging.botpress.cloud', 'clientId': '################################', 'enableConversationDeletion': true, 'showPoweredBy': false, 'className': 'webchatIframe', 'containerWidth': '100%25', 'layoutWidth': '100%25', 'hideWidget': true, 'showCloseButton': false, 'disableAnimations': false, 'closeOnEscape': false, 'showConversationsButton': true, 'enableTranscriptDownload': false, 'stylesheet':'https://webchat-styler-css.botpress.app/prod/7e635f74-0cbd-4fc1-8e64-aa7f2dca60d5/v85394/style.css' }); window.botpressWebChat.onEvent(function () { window.botpressWebChat.sendEvent({ type: 'show' }) }, ['LIFECYCLE.LOADED']); " width="100%" height="800px" >

and for botpress version v11. How to do?