For this you need to add your Landing page URL (without the '?mode=preview' part) as the source of the iFrame and you're ready to go!

Note: it will not work if you use the Embed code.


Example code - this you will need to add to your HTML page:

<iframe src="https://quriobot.com/qb/qbtests3/gMnyjZrgaGbdv40x" width="500px" height="500px" style="float:left"></iframe>



Extra (visual) tip: make the bot input fields as wide as the frame itself with adding the following to the landing page CSS (Bot Settings > CSS for landing page section (developer mode):

.quriobotWidgetContainer{
    max-width:100% !important;
}


Or to make the bot background transparent:

[dir=ltr] .wallpaper, [dir] body {
  background: transparent !important;
}

@media screen and (max-width: 600px) {
  .quriobotWidgetContainer {
    background: transparent !important;
  }  
}



Need more help or looking for inspiration? Join the Quriobot community!

Quriobot
Friendly & Fun
Interact & Convert