Skip to content
New

Your dashboard is here — every conversation, every lead it captured, and what people keep asking about.

Take a look →

How to Add an AI Chatbot to Drupal

Add an AI chatbot to your Drupal website to answer visitor questions, explain your services, and guide people to relevant pages. Choose an embedded chat within your content or a floating chatbot across your website.
Create your bot
  1. Copy the AI Chatbot embed code
  2. Paste the code into your site
  3. The chatbot live on the page

Create your chatbot and copy its code

Open the AI Chatbot editor and enter your website address. Review the generated knowledge, add missing information, and test the chatbot’s answers.

Customize its appearance and choose a layout:

  • Embedded chat window — appears within your page content.
  • Floating chatbot — stays accessible through a chat launcher as visitors browse.

Save your chatbot and copy its complete installation code from the dashboard. Use this code in your chosen installation method below.

Check your Drupal editing permissions. You’ll need permission to edit content or manage blocks, depending on the method you choose.

The instructions below use Full HTML and the editor’s Source mode. Availability depends on your Drupal version and configuration. Full HTML alone does not guarantee that your editor will preserve JavaScript. If the script is removed or the Source option is missing, ask your site administrator to provide an approved way to insert the installation code.

Add AI Chatbot as a floating chat

Use floating chat when you want visitors to ask questions while browsing your website.

Add floating chat across your website

  1. Open block settings. Go to Structure → Block layout and select your active website theme.

  2. Choose a region. Find a footer region and click Place block → Add custom block. Depending on your version, you may need to create the block under Content → Blocks first.

  3. Add your code. Name the block, select Full HTML, switch to Source, and paste the complete floating chatbot installation code.

  4. Configure its display. Save the block, uncheck Display title, and confirm the footer region.

  5. Check visibility. Leave page, content-type, and role restrictions unset if the chatbot should appear throughout the public website.

  6. Save the placement. Save the block configuration and click Save blocks if shown.

The footer block loads the chatbot; the floating layout controls the launcher’s position.

Add floating chat to selected pages

  1. In Structure → Block layout, find your chatbot block and click Configure.

  2. Open Visibility → Pages.

  3. Choose the option to show the block only on listed pages.

  4. Enter the required paths, one per line. Use <front> for the homepage.

  5. Save and check both an included and an excluded page.

Apply these settings to your existing chatbot block rather than adding a second copy.

Add AI Chatbot as an embedded chat

  1. Open the content page. Go to Manage → Content, find the page, and click Edit.

  2. Enable HTML editing. Select Full HTML, then open Source.

  3. Insert your code. Paste the complete embedded chat installation code at the desired position without removing existing content.

  4. Save and publish. Save the changes and ensure the page is published.

  5. Check the result. Open the live page and test the chat.

Check the embedded chat’s position

Place the chat where it supports the page’s purpose. For example, a service page can introduce it after the service description, while a support page can place it below a short invitation to ask a question.

Make sure the surrounding layout leaves enough room for messages and controls. Check the full interface on desktop and mobile, especially if your page uses multiple columns.

Test your chatbot installation

Open your live website in a new or private browser window and check that:

  • The chatbot loads and visitors can send and receive messages.
  • The floating launcher appears on the intended pages.
  • The embedded chat interface is fully visible.
  • The launcher doesn’t overlap navigation, cookie notices, or other controls.
  • Links, contact buttons, and other configured actions work correctly.
  • The chatbot is visible to logged-out visitors, not just administrators.

Test a few questions your visitors are likely to ask. If the chatbot doesn’t appear, check the saved installation code, text-format settings, and block visibility rules. If an answer is incomplete, add the missing information to its knowledge.

Need help with installation?

Contact the support team with your website’s URL and explain whether you want a floating chatbot across the site or an embedded chat on a particular page. Include your Drupal version if you know it. Free installation assistance is available.