Translate any website

What you need

The ability to edit your pages, or a tag manager that can add a script to them.
Nothing on your server. The snippet is a script tag and nothing is installed anywhere.

Where the snippet goes

1
Copy your snippet

Open your site in the Verbafy dashboard and copy the embed snippet. It carries your own site id and public key.
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>
```
Paste it before the closing body tag

On every page. If your pages share a footer include, a layout or a template, put it there once and every page has it.
Load a page

The switcher appears in the bottom right corner. Nothing to build, nothing to deploy beyond the page itself.

Check it is working

Open a page. The switcher is in the bottom right corner.
Switch language. The page text changes where you stand, with no reload.
Open a second page. The language you chose is still the one you are reading.

Worth knowing on Any website

Put the switcher where you want it

data-display takes pill, menu, select, links or none. Everything but the floating pill renders into a <div id="verbafy"></div> you place yourself, in a header or a footer.

A tag manager works

A custom HTML tag firing on all pages does the same job as pasting it into the page, as long as it loads on the page rather than inside an iframe.

The switcher inherits your styling

Eight CSS custom properties set the background, text, border, hover, radius, font, focus ring and shadow. The native select shape is styled by your own stylesheet, like every other select on your site.