Skip to content

Installing the Silvio widget on your website

Authorising your website domain

Section titled “Authorising your website domain”

Before embedding the widget, the Futuh instance must recognise the domain from which it will be embedded as an authorised domain. Without this, the browser will block the connection by CORS policy.

  1. In your Futuh instance, open Settings → Technical → Live Chat → Channels.
  2. Open the channel associated with Silvio (normally called Futuh Web or your organization’s name).
  3. Find the Channel rules tab.
  4. In the active rule, add your website’s public domain in the allowed URL field. For example: https://my-organization.org.
  5. Save and verify that the rule is active with the action Show button and text or Show button only.

Copying the two script tags

Section titled “Copying the two script tags”

Silvio is embedded with two <script> tags. The first loads the widget code, the second registers the necessary resources.

  1. In the Silvio channel, open the Web channels section.
  2. You will see a code snippet ready to copy. It contains two script tags: one points to /im_livechat/loader/... and the other to /im_livechat/assets_embed.js.
  3. Copy the entire snippet.

The snippet looks approximately like this (replace the domain with your instance’s domain):

<script defer src="https://my-organization.futuh.coop/im_livechat/loader/2"></script>
<script defer src="https://my-organization.futuh.coop/im_livechat/assets_embed.js"></script>

The number at the end of the loader is the channel identifier. If your instance has multiple channels, make sure to copy the one for the Silvio channel and not another.

Pasting the snippet into your website

Section titled “Pasting the snippet into your website”

Where to paste the snippet depends on the system your website is built with.

On a static or generated website (Astro, Eleventy, Hugo, Jekyll)

Section titled “On a static or generated website (Astro, Eleventy, Hugo, Jekyll)”
  1. Open your site’s base template (Base.astro, _layout.html, or equivalent).
  2. Paste the two script tags just before the closing </body> tag.
  3. Redeploy the website.

On WordPress, Drupal, or a similar CMS

Section titled “On WordPress, Drupal, or a similar CMS”
  1. Log in to the administration panel.
  2. Find the Appearance → Theme editor or Settings → Footer scripts section, depending on your CMS.
  3. Paste the two script tags in the footer scripts block.
  4. Save and clear the cache if your CMS uses one.

On a service without HTML access

Section titled “On a service without HTML access”

If your platform does not allow adding scripts to the HTML (some website builders restrict this), you will not be able to embed the widget directly. Alternative: use a link that opens the conversation with Silvio in a new tab pointing to your Futuh instance.

Verifying that it works

Section titled “Verifying that it works”
  1. Open the public website in a private/incognito window (to rule out cache).
  2. The chat bubble should appear in the bottom-right corner.
  3. Click the bubble. It should open the chat window with Silvio’s greeting.
  4. Write a test question. Silvio should reply within a few seconds.

Troubleshooting

Section titled “Troubleshooting”
  • The bubble does not appear: check that the two script tags are on the page and that your website’s domain is authorised in the channel rules.
  • The bubble appears but the chat does not load: open the browser console. If you see CORS errors, the domain is not correctly authorised. If you see network errors, check that your Futuh instance domain is publicly accessible.
  • The chat loads but Silvio does not respond: check in the Futuh instance that the agent is active and that the AI model has a valid API key. Details in Configure Silvio.
  • The widget style does not match your website: you can customise colours and typography from the channel record in Futuh, in the visual customisation tab.

Next steps

Section titled “Next steps”