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.