I need help with i18n translate shortcode

Hi everyone ! I have some trouble while implement some shortcode for my personal blog
This is notice board (show warning/tip/note/info booard which i’ll call $noticeType from now on) in single.html
The thing is, i tried to translate the $noticeType to my language by using i18n system of hugo. You can see that i created the file call vi.yaml (Vietnamese)

Example

This is how my shortcode work

{{< notice "tip" >}}
This is **tips**
{{< /notice >}}

vi.yaml

# <project_root>\themes\<my_theme>\i18n\vi.yaml
- id: warning
  translation: "Cảnh báo"
- id: note
  translation: "Ghi chú"
- id: info
  translation: "Thông tin"
- id: tip
  translation: "Mẹo"

and set my languageCode in config.toml to vi-VN

config.toml

# config.toml
baseURL = '/'
languageCode = 'vi-VN'

But somehow is not showing up my translated string in the header.

notice.html


<!-- /<project-root>/layouts/shortocdes/notice.html -->
{{ $noticeType := .Get 0 }}

<div class="{{$noticeType}}-container">
    <div class="notice-header {{$noticeType }}-header">
        <!-- Note/Warning/Info/Tip -->
        <span>
             <!--This is where i want to show translated-string with i18n -->
            {{ i18n $noticeType }}
        </span>            
    </div>
    <div class="notice-content {{ $noticeType }}">
        <p>{{.Inner | markdownify}}</p> 
    </div>
</div>

I really need help. Thanks you.

1 Like

The languageCode is only used to populate a couple of internal templates. It is not used as a translation key. See:
https://gohugo.io/getting-started/configuration/#languagecode

The default content language is en. If your site only has one language, do this in your site config:

baseURL = 'https://example.org/'
title = 'My Site'
languageCode = 'vi-VN'
defaultContentLanguage = 'vi'

If your site has multiple languages do something like:

baseURL = 'https://example.org/'
defaultContentLanguage = 'vi'

[languages.vi]
contentDir = 'content/vi'
title = 'My Site (vi)'
languageCode = 'vi-VN'
weight = 1

[languages.en]
contentDir = 'content/en'
title = 'My Site (en)'
languageCode = 'en-US'
weight = 2
1 Like

FYI (and localized):

I just borrowed your vi.yaml file for this component. Thank you.

1 Like

Hi everyone ! , look like i’m solved my problem thanks to @jmooring solutions and reading some tutorial on internet.
@martignoni You’re welcome ! . I’m glad that i can help someone who really need it :heart:

1 Like

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