How to embed a pop bot with automatic load and button

Pau Sanchez Updated by Pau Sanchez

Below is the sample code of a site that will trigger a pop up as soon as the site is loaded, and a button that if clicked it will reopen the bot once is closed



<!DOCTYPE html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0"> 
</head>
<body>
<button type="button"onclick="openLandbot()">OPEN BOT</button>

<script>
//To check if snippet has already been added to the DOM
var scriptUploaded = false;

//Check and ADD main script or open the bot
function openLandbot(){
if (scriptUploaded){
myLandbot.open()
} else {
scriptUploaded = true;
var script = document.createElement("script");
script.type = "text/javascript";
script.setAttribute("SameSite","None; Secure");
script.onload = triggerLandbot()
script.src = "https://static.landbot.io/landbot-widget/landbot-widget-1.0.0.js";
document.head.appendChild(script);
}
}

//Once the main script has been loaded, create new object and open pop up

function triggerLandbot(){
setTimeout(function(){
var script = document.createElement("script");
script.innerHTML = `var myLandbot = new LandbotPopup({ index: 'https://landbot.io/u/H-XXXXX-XXXXXXXXXXXX/index.html', //Please change url according to your needs open: true, launcherOptions: { enable: false } });`;

document.body.appendChild(script);
},3000)
}
</script>
</body>
</html>

How did we do?

How to Perform Basic Calculations

How to trigger events and/or pass values from Landbot to the container site

Contact