Conferbot Widget Installation
Overview
Conferbot's code snippet allows you to seamlessly integrate a chatbot widget into your product or website. You can choose any one or more of the three types of widgets that we have, live-chat, popup, or full-page. The widget can be customized to your liking and you can get them up and running in just a few minutes.
How to add Conferbot to your site?
Follow the simple steps below to setup a widget of your choice on your website or product and voila! Your chatbot will be ready to start conversing with your customers.
1. Go to your Conferbot account . If you don’t have one create a free account now.
2. Build a chatbot from scratch
or copy from 100+ free bot templates
.
3. Open the builder and modify the flow
to suit your business needs and click on the Save
button on the toolbar.
4. Click on the Next
button on the top right corner of the toolbar to head to the customize screen.
5. Customize your chatbots appearance and other settings and click on the Next
button at the bottom.
6. Now, select your sites' platform/framework
and then choose the widget type
you want to add.
7. A code will be generated and would look something like this 👇
<!--Start of Conferbot Script-->
<script type="text/javascript">
(function (d, s, id) {
var js,
el = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {
return;
}
js = d.createElement(s);
js.async = true;
js.src = 'https://s3.ap-south-1.amazonaws.com/conferbot.defaults/dist/v1/widget.min.js';
js.id = id;
js.charset = 'UTF-8';
el.parentNode.insertBefore(js, el);
// Initializes the widget when the script is ready
js.onload = function () {
var w = window.ConferbotWidget("6304946c11a3e557d09dd2d5");
};
})(document, 'script', 'conferbot-js');
</script>
<!--End of Conferbot Script-->
8. The pasting of the code snippet is the last step, it varies based on the platform/framework of your website
.
8a. Log into your wordpress account and go to "Plugins"
8b. Search for "Simple Custom CSS and JS" and install it.
8c. On the Dashboard, click on "Add Custom JS", this gives you a text area where you can paste the code snippet.
8d. Paste the code snippet and click on "Save Changes / Update" button.