Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add i18n guidance re. images & shortcodes + some rework #4790

Merged
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
82 changes: 60 additions & 22 deletions content/en/docs/contributing/localization.md
Original file line number Diff line number Diff line change
@@ -1,45 +1,83 @@
---
title: Site localization
description:
Guidance on creating and maintaining site page in non-English localizations.
description: Creating and maintaining site pages in non-English localizations.
linkTitle: Localization
weight: 25
cSpell:ignore: shortcodes
---

{{% pageinfo color="warning" %}}

🚧 This DRAFT page is under active development. 🚧

{{% /pageinfo %}}

This website uses Hugo's [multilingual framework] to support page localizations.
The OTel website uses Hugo's [multilingual framework] to support page localizations.
English is the default language, with US English as the default (implicit) localization.
A growing number of other localizations are supported, as can be seen from the languages
dropdown menu in the top nav.

## Translation tips
## Translation guidance

We recommend that you follow the guidance offered in this section when
translating pages.

### Heading anchors

To ensure that heading anchor targets are uniform across localizations, when
translating headings:

- Preserve the heading's explicit ID if it has one. [Heading ID syntax] is
written after the heading text using syntax like `{ #some-id }`.
- Otherwise, explicitly declare a heading ID corresponding to the autogenerated
ID of the original English heading.

{{% alert title="Note" %}}

We leave it to the discretion of localization authors to decide if they add an
explicit heading ID to all headings of translated pages, or whether this is only
done for known intra-site heading targets, as reported by the link checker. The
former option is more uniform and more work. It better supports having
site-external targets into localization pages and avoids having to revisit
previously translated pages as new heading targets are used.

When you translate page content, follow this guidance:
{{% /alert %}}

[Heading ID syntax]:
https://github.com/yuin/goldmark/blob/master/README.md#headings

### Links

- To ensure that heading anchor targets are uniform across localizations, when
translating headings:
- If the heading has an explicit ID (which is of the form `{ #some-id }` and
comes after the heading text), then preserve the given ID
- Otherwise, include a heading ID corresponding to the original English
heading text.
- For link references that are local paths, preserve the path _as is_.
For link references to local paths (as opposed to external links), preserve the
path _as is_. This holds true for links to website pages or section-local
resources such as images.

{{% alert title="Note" %}}

This repository has a custom render-link hook that Hugo uses to convert
**absolute link paths to documentation pages** that are of the form
`/docs/some-page`, to be locale specific, by prefixing the path with page
The OTel website repository has a custom render-link hook that Hugo uses to
convert **absolute link paths to documentation pages**. Links of the form
`/docs/some-page` are made locale specific by prefixing the path with the page
language code when rendering the link. For example, the previous sample path
would become `/ja/docs/some-page` when rendered from a Japanese page.

{{% /alert %}}

## Keeping track of localized page drift {#track-changes}
### Images

Hugo is smart in the way that it renders page images that are shared across site
localizations. That is, in the generated site folder, Hugo will output a
_single_ image file that is then shared across localizations.

So as a general rule, _do not_ make copies of image files in your localization
unless you actually change the image.

### Shortcodes

Some of the base shortcodes contain English text that you might need to localize
-- this is particularly true of those contained in [layouts/shortcodes/docs].

If you need to create a localized version of a shortcode, place it under
`layouts/shortcodes/xx`, where `xx` is your localization's language code. From
there, use the same relative path as the original base shortcode.

[layouts/shortcodes/docs]:
https://github.com/open-telemetry/opentelemetry.io/tree/main/layouts/shortcodes/docs

## Keeping track of localized-page drift {#track-changes}

One of the main challenges of maintaining localized pages, is identifying when
the corresponding English language pages have been updated. This section
Expand Down