Skip to content
Platforms

Drupal

How to add the Otto chat to a Drupal 10 or 11 site with the Header and Footer Scripts module or through the theme, and how to clear the cache.

On this page

Drupal is a content management system with no admin field for custom code. You add the chat with the Header and Footer Scripts module, which takes the whole line of code, or your developer adds it to the theme. With the module installed, it takes about 5 minutes.

What you need

  • An Otto account. You find the chat code in the panel under Overview, on the Installation & integrations card, on the Drupal tile. It is under the More platforms tile, and you can also search for it.
  • An account with a site administrator role or the Add Scripts all over the site permission.
  • The Header and Footer Scripts module. If your site does not have it, your developer or server admin downloads it with Composer.

Chat code

On the Drupal tile, click Copy code. You get one line with your company’s public key:

<script async src="https://ottoai.sk/widget.js" data-otto-key="pk_vas_kluc"></script>
The sample shows pk_vas_kluc instead of a key, the tile gives you the code with your own key. The key is not a password, you do not need to hide it. Add the code once, it covers the whole site.

Adding the code

Header and Footer Scripts module

  1. If you do not have the module yet, your developer downloads it with composer require drupal/header_and_footer_scripts.
  2. In the admin, open Extend, tick Header and Footer Scripts and click Install.
  3. Open Configuration, Development, Header Footer Scripts and the Footer Scripts tab.
  4. Paste the chat code into the Footer Scripts field and click Save configuration.
  5. Clear the cache: Configuration, Development, Performance, Clear all caches.

Theme (developer)

  1. Your developer copies the html.html.twig template into your custom theme or subtheme and pastes the chat code just before </body>.
  2. Or they add a theme library with the external script https://ottoai.sk/widget.js, the attributes async: true and data-otto-key with your key, attached in the theme’s .info.yml under libraries.
  3. Then they clear the cache: Configuration, Development, Performance, Clear all caches.
The Footer Scripts field does not accept HTML comments. Paste only the line of code from the panel.

You can also follow the official Drupal help.

Checking it works

  1. Open your website in a new browser window and reload. A chat bubble should pop up in the bottom right.
  2. Send the chat a test question. Otto answers within a few seconds.
  3. In the panel, under Settings, Connections, the Your website row shows the domain the chat runs on.
The module adds the code to every page, so you will see the chat in the Drupal admin too.

What Otto knows about your site

Otto answers from the pages of your website and from the knowledge you add in the panel. Once the chat runs on your site, turn on I have no XML feed, let Otto read my site in the panel under Settings, Catalogue. More in Reading your website.

Troubleshooting

The module is not in the Extend list

The module has not been downloaded yet. Your developer adds it with Composer, then it appears in the list and you can install it.

The chat does not show after saving

Clear the cache with Clear all caches. Check that the code is in the Footer Scripts field, not in Footer Styles.

I cannot see the Header Footer Scripts page

Your role lacks the Add Scripts all over the site permission. Ask your site administrator to grant it.

Also check

  • Reload the page without cache with Ctrl+F5, or open it in a private window.
  • The code should be on the page only once, a second copy is ignored.
  • A cookie consent bar can block scripts until the visitor agrees. If the chat only shows up after consent, see Cookie consent.
  • If your site sends a Content-Security-Policy header, allow https://ottoai.sk in it, as shown in Content-Security-Policy.
  • In the browser console (F12), look for messages starting with [Otto]. They tell you what the chat is missing.
  • Still nothing? Write to us at podpora@ottoai.sk and include your website address.

Removing the chat

Delete the code from Footer Scripts, save and clear the cache. You can then uninstall the module in Extend, on the Uninstall tab.