How to add Dropchat to your Weebly site

Embedding a Dropchat bot on your Weebly site to create the perfect AI assistant.

  •  First, log into your Dropchat account.

  • Click into any of the chatbots you have made previously. If you have not made a chatbot before, check out this guide. In this example, we will use a chatbot we already made from a PDF of the Bitcoin white paper.

  • After clicking into your chatbot, navigate to the "Manage Chatbot" tab towards the top left.
  • In the middle section, under "Share Chatbot", click the blue "Embed" button. 

A pop-up will appear with options on how to add a Dropchat to your site. In this example, we will be creating a chat bubble in the bottom right of your site, which is the most user-friendly option for most websites.

  • Click the "Copy Code" icon on the top code snippet option.

Now that you have this code snippet copy-pasted, we can go to Weebly.

There are different ways to add the code snippet in 

  • At the site level
  • On the page level

Embedding within the website header (site level)

In this example, we are going to use a basic Weebly template to demonstrate how to add Dropchat at the site level (will add Dropchat to all pages).

  • In Weebly, go to "Settings" at the top-left of the navigation bar.

  • From there, go to the "SEO" section on the left-hand side.

  • Paste the code snippet into the "Header Code" text box.

  • After saving your changes and publishing the site, your Dropchat bot should be deployed at the bottom-right of every page of your Weebly site.

Adding Dropchat to a specific page

  • In order to embed a script at the page level, drag and drop the “Embed Code” element onto your web page.

  • Click where it says "Click to set custom HTML". Then click "Edit Custom HTML"
  • Paste the code snippet from earlier into this box.
  • After publishing the site, the Embed Code element will not be visible, but the Dropchat bot will be now functional at the bottom-right of the web page.