How to Embed Your Chatbot Video Guide

Learn how to embed your bot into your website covering all different embedding options.

In this video, we dive into the best methods for integrating chatbots into your website to enhance your lead generation for sales. We cover various embedding options that will help you automate lead generation and improve lead conversion.

We start with Livechat, which places a chat bubble at the bottom right of your website, allowing for proactive messages to capture users' attention. This method not only enhances user engagement but also aids in automated sales follow-up. Plus, you can optimize your website's SEO by delaying the bot’s loading until user interaction, either through cursor movement on desktops or screen touches on mobile devices.

Next, we explore the Fullpage option, where your chatbot appears as a full-page overlay for an immersive user experience. Simply copy and paste the provided code to embed it seamlessly. The Embed option, a popular choice, allows you to customize the widget’s height and automatically updates in the code, though it’s essential to place the iframe code accurately on your website.

Finally, the Popup display covers most of the visible screen with your chatbot, featuring proactive messages and improved SEO performance. Embedding is straightforward—just copy and paste the HTML code into the body section of your website.

This tutorial offers a complete guide on how to embed chatbots effectively. Discover how chatbot integration can transform your digital marketing strategy and automate your sales processes.

00:00 Intro

‍

00:30 Livechat

‍

01:18 Fullpage

‍

01:35 Embed

‍

01:55 Popup

‍

02:14 Outro

Hey there! Nik here from the content team. Today we’ll see how to embed your bot into your website. We have specific tutorials on how to do it for Webflow or Wordpress if that’s your case! I’ll leave the links to those videos down in the description.

But today will cover embedding in a more general way, explaining each option available. So, Let’s start. We’re in the builder now. If we go up into the share section, you will see all the display options. Let’s start with the first one, Livechat. This option will add a chat bubble at the bottom right of your website that, when clicked, will display a Live Chat. You’ll see that you will have the option to show a proactive message. This message will help capture the attention of the users and get them to click on the widget.

You can also “Improve SEO performance” by clicking on the checkbox, this will change the code so that the bot won’t load until the cursor moves for desktop or the screen is touched for mobile, improving the SEO of your website.

Once we are done we can copy the html code and paste it inside the body part of your website. It’s that simple. The next option is Fullpage, as its name says, it is meant to be shown as a full page in your website to maximize the experience, the bot will be displayed just like you see it in the Share with a Link mode of your bot. To display it, you would need to copy the code and paste it on your website.

Moving into the embed option, the most common, It gives you more flexibility on the location of the bot as it’s located in an iframe on your website. You can change the widget height to the desired one here and it automatically updates in the code. Since it will be located in a frame, you will need to know exactly where to paste the code on your website.And moving into the last option, the Popup display, you will be able to display a Popup modal, covering most of the visible screen with your bot.

By default, this option launches the bot automatically from the widget.Like in the Livechat, you can show a proactive message and improve the SEO performance. To embed it, you just have to copy the HTML code and paste it into the body section of your website.And that 's it! I will leave all the useful links down in the description. I’m Nik, and I'll see you in the next one!