Add the chat to your pages

One script tag, from your own site, on the pages that should show the chat.

One script tag puts the chat on a page. It loads from your own site, and only your site answers it.

01 · The tag

Paste it before </body>:

<script src="/opensolr-chat/widget.js" defer></script>

The Add to your pages tab of the admin shows this same tag with the path your chat is mounted on. If you changed base_path, copy it from there.

02 · Where to put it
  • On every page: in the template that every page shares, usually the footer of your theme or layout, just before </body>.
  • In a CMS: in the theme’s footer template, or in its setting for scripts at the end of the page, if it has one.
  • On some pages only: leave the tag out of the others. On opensolr.com, for example, it is on every page except the search pages.

Loading the tag twice on one page does no harm: the chat starts once.

03 · It must come from your own site

The chat works only on pages of the site it is installed on. A page on another host that loads the script cannot read the chat’s settings and shows no chat button. To have the chat on two sites, install it on each.

That also counts between www.example.com and example.com. Keep the address in the tag relative, as above, starting with /, and the script always comes from the host the visitor is on.

Behind a reverse proxy, the proxy must pass on the host name the visitor used (proxy_set_header Host $host; in nginx, ProxyPreserveHost On in Apache). Otherwise the chat sees another host than the visitor’s browser and refuses every question with This chat answers only on its own site.

04 · What it adds to your page
  • One element at the end of the page, <opensolr-chat-bot>, with the button and the window isolated inside it, so your styles and the chat’s never mix.
  • When the captcha has to be shown: the reCAPTCHA script from Google and its box over the window.
  • In the visitor’s browser: the conversation, the size of the window and the solved captcha, under names starting with opensolr-chat:, and the cookie opensolr_chat_pass when the captcha is on.

The script itself is checked by the browser on every page load and downloaded again only when it changed, so an update of the client reaches your visitors on their next page view.

05 · Content-Security-Policy

If your site sends a Content-Security-Policy header, it must let your pages load the script from your own site and make requests to it, and, with the captcha on, load reCAPTCHA. For example:

script-src 'self' https://www.google.com/recaptcha/ https://www.gstatic.com/recaptcha/;
frame-src https://www.google.com/recaptcha/ https://recaptcha.google.com/;
connect-src 'self';
img-src 'self';

Add these to the policy you already have; do not replace it.

The Opensolr Chat Bot Client is open source and MIT licensed. Questions about your Opensolr account, index or plan go to opensolr.com/contact; questions about the client itself belong on GitHub.

Opensolr Chat Bot Documentation