You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: user_guide/23-internationalization.qmd
+57-21Lines changed: 57 additions & 21 deletions
Original file line number
Diff line number
Diff line change
@@ -8,22 +8,31 @@ versions: ">=0.4"
8
8
9
9
# Internationalization
10
10
11
-
Great Docs can display all of its UI text in multiple languages. When you set a language, every button label, tooltip, relative timestamp, navbar link, and accessibility attribute across the site is automatically translated.
11
+
If your project has users around the world, presenting documentation in their language makes a real
12
+
difference. Even when the actual content is in English, translating navigation labels, button text,
13
+
and timestamps removes friction and signals that the project cares about accessibility.
14
+
15
+
Great Docs can display all of its UI text in multiple languages. When you set a language in
16
+
`great-docs.yml`, every button label, tooltip, relative timestamp, navbar link, and accessibility
17
+
attribute across the site is automatically translated.
12
18
13
19
## Setting the Language
14
20
15
-
Add the `language` key under `site` in your configuration file. The value is a [BCP 47](https://en.wikipedia.org/wiki/IETF_language_tag) language code:
21
+
Add the `language` key under `site` in your configuration file. The value is a
22
+
[BCP 47](https://en.wikipedia.org/wiki/IETF_language_tag) language code:
16
23
17
24
```{.yaml filename="great-docs.yml"}
18
25
site:
19
26
language: fr
20
27
```
21
28
22
-
If you don't set a language, Great Docs defaults to English (`en`).
29
+
If you don't set a language, Great Docs defaults to English (`en`). Only a single language can be
30
+
active at a time.
23
31
24
32
## Supported Languages
25
33
26
-
Great Docs ships with translations for 23 languages:
34
+
Great Docs ships with translations for 23 languages. If yours is in the list, all you need is the
35
+
`language` key in `great-docs.yml`:
27
36
28
37
| Code | Language |
29
38
|------|----------|
@@ -51,9 +60,13 @@ Great Docs ships with translations for 23 languages:
51
60
|`el`| Greek |
52
61
|`hi`| Hindi |
53
62
63
+
If your language isn't listed here and you'd like to contribute a translation, see the
64
+
[How It Works](#how-it-works) section below for details on the translation pipeline.
65
+
54
66
## What Gets Translated
55
67
56
-
Setting the language affects every piece of UI text that Great Docs generates. Here's a summary of what changes:
68
+
Setting the language affects every piece of UI text that Great Docs generates. Here's a summary of
69
+
what changes:
57
70
58
71
### Navbar Labels
59
72
@@ -81,41 +94,64 @@ All interactive widgets use the configured language:
81
94
82
95
### Page Metadata
83
96
84
-
The page metadata widget displays relative timestamps like "3 days ago" or "2 months ago". These time expressions are fully translated and support correct singular/plural forms for each language. The tooltip date format also adapts to match the configured locale.
97
+
The page metadata widget displays relative timestamps like "3 days ago" or "2 months ago". These
98
+
time expressions are fully translated and support correct singular/plural forms for each language.
99
+
The tooltip date format also adapts to match the configured locale.
85
100
86
101
### Table of Contents
87
102
88
-
The "On this page" heading above the right-hand table of contents is translated to match your configured language.
103
+
The "On this page" heading above the right-hand table of contents is translated to match your
104
+
configured language.
105
+
106
+
All of these translations are applied automatically. You don't need to provide any translation files
107
+
or configure anything beyond the `language` key.
89
108
90
109
## Right-to-Left (RTL) Support
91
110
92
111
::: {.callout-note}
93
-
RTL layout support for languages like Arabic and Hebrew is under active development and not yet available. The underlying translations exist, but the visual layout needs further work before these languages can be officially supported.
112
+
RTL layout support for languages like Arabic and Hebrew is under active development and not yet
113
+
available. The underlying translations exist, but the visual layout needs further work before these
114
+
languages can be officially supported.
94
115
:::
95
116
96
117
## Placeholders and Plurals
97
118
98
-
Some translation strings include placeholders and plural forms. These are handled automatically by the widgets at runtime:
119
+
Translation strings aren't always simple substitutions. Some include dynamic values and need to
120
+
handle singular and plural forms correctly. Great Docs handles both cases automatically at runtime:
99
121
100
-
-**Placeholders** use `{name}` syntax: for example, `"Refreshed {time}"` becomes `"Actualisé {time}"` in French, where `{time}` is filled in with the relative timestamp.
101
-
-**Plurals** use a `singular|plural` pipe format: for example, `"{n} day ago|{n} days ago"` becomes `"il y a {n} jour|il y a {n} jours"` in French, with the correct form selected based on the count.
122
+
-**Placeholders** use `{name}` syntax: for example, `"Refreshed {time}"` becomes
123
+
`"Actualisé {time}"` in French, where `{time}` is filled in with the relative timestamp.
124
+
-**Plurals** use a `singular|plural` pipe format: for example, `"{n} day ago|{n} days ago"` becomes
125
+
`"il y a {n} jour|il y a {n} jours"` in French, with the correct form selected based on the count.
102
126
103
127
## How It Works
104
128
105
-
Understanding the translation pipeline can be helpful if you're contributing translations or debugging language issues:
129
+
Understanding the translation pipeline can be helpful if you're contributing translations or
130
+
debugging language issues:
106
131
107
-
1. You set `language` in `great-docs.yml`
108
-
2. During the build, Great Docs looks up all translation strings for that language from its internal dictionary
109
-
3. The full translation bundle is written into `_gd_options.json`
110
-
4. After Quarto renders each page, the post-render script injects a `<meta name="gd-i18n">` tag into the HTML `<head>` containing the JSON-encoded translations
111
-
5. Each JavaScript widget reads from this meta tag using a shared `_gdT(key, fallback)` helper function
132
+
1. you set `language` in `great-docs.yml`
133
+
2. during the build, Great Docs looks up all translation strings for that language from its internal
134
+
dictionary
135
+
3. the full translation bundle is written into `_gd_options.json`
136
+
4. after Quarto renders each page, the post-render script injects a `<meta name="gd-i18n">` tag into
137
+
the HTML `<head>` containing the JSON-encoded translations
138
+
5. each JavaScript widget reads from this meta tag using a shared `_gdT(key, fallback)` helper
139
+
function
112
140
113
-
If a translation is missing for a particular key, the English fallback is used automatically.
141
+
If a translation is missing for a particular key, the English fallback is used automatically. This
142
+
means partial translations are safe to ship: untranslated strings appear in English rather than as
143
+
blank text or error messages.
114
144
115
145
## Next Steps
116
146
117
-
Internationalization lets you serve documentation in your users' language with a single config setting. Great Docs translates all UI chrome (navigation, search, tooltips) while you focus on translating the content that matters most.
147
+
Internationalization lets you serve documentation in your users' language with a single config
148
+
setting. Great Docs translates all UI chrome (navigation, buttons, tooltips, timestamps) while you
149
+
focus on translating the content that matters most.
118
150
119
-
-[Configuration](configuration.qmd) covers the `language` setting and other `great-docs.yml` options
120
-
-[Theming & Appearance](theming.qmd) explains how translated labels integrate with your site's visual design
151
+
-[Configuration](configuration.qmd) covers the `language` setting and other `great-docs.yml`
152
+
options
153
+
-[Theming & Appearance](theming.qmd) explains how translated labels integrate with your site's
154
+
visual design
121
155
-[SEO Optimization](seo.qmd) covers how language settings affect search engine indexing
156
+
-[Social Cards](social-cards.qmd) explains Open Graph metadata, which can include language
0 commit comments