Localization effort: The Website

Special Interest Groups SIG Documentation
30

From the code I’ve read it should be by their identify for example http://localhost:4321/en/ for English.

1 Like
31

That’s what I’ve been trying based on this: feat: i18n by mrshmllow · Pull Request #3 · auxolotl/website · GitHub, but given that I keep getting 404’s I’m guessing some type of redirect is missing - perhaps specifically from the dev mode?

1 Like
32

I’m not well versed in Astro, we best consult @coded.

33

taking a look into how i18n works for astro. Gimme a few moments.

1 Like
34

Ok, I’ve done some digging @AngryAnt, there’s a couple of steps.

  1. In src/pages create a directory named the 2 letter code of the language (eg: french would be fr).
  2. Copy and paste the index.astro file into the directory (it can stay unmodified).
  3. In public/locales create a directory named the same 2 letter code as earlier.
  4. Copy public/locales/en/translations.json into the directory you just made.
  5. Add the language in src/i18n/ui.ts in the same way English is added.
  6. Do your translations.

There may be a way to do this with dynamic routing, but since Astro needs to build everything to static I’ll have to do some more research on that. This way is fine for now.

2 Likes
35

Excellent! I have it working. Notes for others:

  • Remember to prefix all the imports in index.astro now that you have copied the file up one level.
  • Modified ui.ts looks something like this:
import en from "../../public/locales/en/translations.json"
import dk from "../../public/locales/dk/translations.json"

export const languages = {
	en: 'English',
	dk: 'Danish'
};

export const defaultLang = 'en';

export const ui = {
	en,
	dk
} as const;

I take it that for the PR I’ll not commit the duplicate index.astro?

Screenshot_20240504_190750
Screenshot_20240504_1907501025×1171 101 KB

3 Likes
36

Looks great. You should be committing one additional index.astro for the PR. I’ll work on adding the dynamic routing later.

2 Likes
37

Hello everyone! I will try and add a language switcher soon.

3 Likes
38

Add the language in src/i18n/ui.ts in the same way English is added.

Also, you need to make sure the name of the language is in that language. For example French becomes Français.

3 Likes
39

I’m currently translating strings to Spanish and I’m having some trouble with certain tech specific terms. How would you think the verb “to fork” should be translated?

This is probably better off at the PRs of the website but I think it’s to soon to move it there. :sweat_smile:

Already created a draft PR!

4 Likes
40

Ready for review :smiley_cat:

5 Likes
41

With these translations we are already providing a more accessible project than NixOS, believe it or not! I can’t seem to find any internationalization infrastructure for the NixOS site or its documentation. This is a pretty big deal, we are already beginning to fill a void and bring the project within reach of more people!

7 Likes
42

Nice work. I dropped some quick comments and it gave me the push I needed to wrap up content completion: translations: init danish by AngryAnt · Pull Request #14 · auxolotl/website · GitHub

2 Likes
43

I got started on the german translation, but it’s very early stage right now

6 Likes