Making a Multilingual Hugo Website

Traditionally, creating and managing multilingual websites in Hugo can be quite complex, involving new structures, and large complex .toml i18n files. With Omnilingual Access, the only thing you have to do is add a single line of code – instantly making websites multilingual, with translations that are much easier to manage.

Omnilingual Access is a language widget that instantly translates sites as users visit pages and selects languages. These translations can be edited further by human translators in one convenient UI. Whilst Omnilingual Access is a paid service, it drastically simplifies translation management. To install OmnilingualAccess:

Sign up to OmnilingualAccess.com and whitelist your website url.
(A subscription is required.)
The Omnilingual Access script should be added just before the ending </body> tag on each page. Identify where you would like to add the script: either in the base template (e.g. layouts/default/baseof.html), or in the theme’s footer component (e.g. <theme>/layouts/partials/shared/footer.html).

Add the Omnilingual Access widget:

<script src="https://lib.omnilingualaccess.com/scripts/omni-access-1.x.js?options=auto-assign-translatables"></script>

For example, it coulde be pasted inside layouts/default/baseof.html :

<!DOCTYPE html>
<html lang="{{ .Site.Language.Lang }}">
<head>
  <meta charset="utf-8">
  <title>
    {{ block "title" . }}{{ .Title }} | {{ .Site.Title }}{{ end }}
  </title>
</head>
<body>
  {{ block "main" . }}{{ end }}

  <!-- Omni-Access Script -->
  <script src="https://lib.omnilingualaccess.com/scripts/omni-access-1.x.js?options=auto-assign-translatables"></script>

</body>
</html>

And that’s it! 🎉 Your Hugo site is now multilingual, instantly accessible in every language! 🌐

If you have any questions or issues, send me an email – I’m happy to help!