Self-hosted CMS

Translate a Drupal site

One snippet in your front-end theme's page shell, wrapped so it only reaches visitors who are not logged in. Your editors' own browsing never spends your word allowance.

Get started free See it running

What you need

Drupal 10 or 11, and a custom theme or a sub-theme whose templates you can edit.
Permission to clear caches, or a deployment that does it for you.

Where the snippet goes

Copy your snippet

Open your site in the Verbafy dashboard and copy the embed snippet.

Your page, before </body>

<script
  src="https://cdn.verbafy.app/widget.js"
  data-site-id="site_abc123"
  data-api-key="pk_live_your_key"
></script>

Make sure your theme has an html.html.twig

If your theme does not override it yet, copy core's into your theme's templates/ directory: core/modules/system/templates/html.html.twig.

Paste it inside the logged-out branch

Add this immediately before the closing </body> tag, with your own snippet in place of the one below.

html.html.twig

{% if not logged_in %}
  <script
    src="https://cdn.verbafy.app/widget.js"
    data-site-id="site_abc123"
    data-api-key="pk_live_your_key"
  ></script>
{% endif %}

Clear caches

Drupal compiles Twig, so the change lands on the next cache rebuild: drush cr, or Configuration, Performance, Clear all caches.

Keep it off your admin

Why the snippet is scoped to anonymous visitors

Drupal serves its administration pages with a separate administration theme, set under Appearance, so a snippet in your front-end theme is already off /admin on a standard site. The {% if not logged_in %} wrapper does the rest. It covers a site where the two themes are the same, and it keeps every logged-in editor's page view out of your word allowance. logged_in is one of the variables core documents on html.html.twig, so nothing extra has to be prepared for it.

Check it is working

Open the site in a private window, logged out. The switcher is in the bottom right corner.
Switch language. The page text changes in place.
Log in and open /admin. There should be no switcher anywhere behind the login.

Worth knowing on Drupal

Views, blocks and AJAX

Anything Drupal renders into the page is text in the DOM, including content that arrives over AJAX after the first paint. It is translated as it appears.

Core's own translation system is untouched

Verbafy works on the rendered page in the browser. It does not read or write Drupal's interface translations, and it does not need the multilingual modules turned on.

Steps taken from Drupal's own documentation