I18n keys working in index.html and partials/shortcodes, but not in .html /content files

support
1

Hi all,

New to Hugo and learning as I go. I’ve got my own template where I have multiple .html pages located like this in /content:

/content
  /en
    /webpage.html
  /nl
    /webpage.html

I am however running into the issue where my i18n keys are not being loaded there. It just shows up as the key itself like this in the rendered page: {{ i18n "website-hero-title" }}. They do however work in my index.html located in /themes/theme/layouts. They also work in shortcodes that are loaded in webpage.html, so that’s a bit weird for me.

Image for clarification for what I am seeing on the rendered page:

image
image1202×148 38.9 KB

The webpages.html contain some frontmatter, which is being loaded, for example the Title and Description.

This is the setup in my hugo.toml:

[languages]
  [languages.en]
    contentDir = 'content/english'
    languageName = 'English'
    languageCode = 'en-US'
    weight = 10
  [languages.nl]
    contentDir = 'content/dutch'
    languageName = 'Nederlands'
    languageCode = 'nl-NL'
    weight = 10

And I’ve set the language files up like:

/i18n
  /home
    /en.yaml
    /nl.yaml
  /website
    /en.yaml
    /nl.yaml

From my point of view everything is done right, but I’m guessing something is missing :slight_smile: . How can I make sure that the i18n keys are being rendered in my /content .html pages?

Thanks for the help!

2

Template code (e.g., {{ doSomething "withThis" }}) goes in templates.

Do you have a good reason for using the HTML content format instead of markdown? Just curious.

In either case, look into shortcodes in the documentation if you need to translate a single word within content, otherwise the content in the two files should be different.

3

I am not creating a blog website, but rather a marketing website that has different pages with different structures on every page, repeating only some elements. That’s why I am not using markdown but rather HTML. Hopefully that makes sense.

Every word on the page needs to be translated, not just one. The reason for using the i18n like that is because the language.yaml files are going to be shared with non-developers so that more people have access to change the texts on the pages (want to keep them away from the .html files for ease of use in translating).

Would it still be possible to use the en.yaml files and create the keys there while using them in a way in the .html /content pages?

4

This bit…

5

Sorry if this comes off as not knowing a thing, but is there a way to take the default i18n functionality and use them in shortcodes? I feel creating a shortcode for every key/word is creating unnecessary extra work.

My translation yaml files will probably have approximately 800 keys which is why I don’t want to create so many shortcodes.

Thanks for the help so far!

6

i18n/en.toml

foo = 'bar'
baz = 'quz'

layouts/shortcodes/T.html

{{ T (.Get 0) }}

In your content files (markdown, html, adoc, etc.)…

{{< T foo >}}

To be specific… https://gohugo.io/templates/shortcode-templates/

1 Like
7

Thank you so much, I managed to get it working.

If you don’t mind me asking, I’ve seen more than just you asking people why they’re not using Markdown for the content pages. Why is that? Is it considered bad practise to use .html there?

8

Not at all. But for new users, my first concern is that they are trying to place templates within the content directory.

9

This topic was automatically closed 2 days after the last reply. New replies are no longer allowed.