Changing Non-Text Media Content

Swapping out images and links (to PDFs, for example) for each language.

Currently, Localize cannot translate any text embedded within images on your application. Here's what we suggest to translate this content.

If possible, when creating images with text, we recommend removing the text from the image itself, and adding the text on top of the image in HTML. Localize will then translate any text that is placed on top of an image.

If you're unable to decouple the text from your images, you can manually create multiple translated versions of your images and display the correct version using Javascript or CSS.

JavaScript

Localize fires a setLanguage event when the language of the page is changed. Here's how it works:

Localize.on('setLanguage', function(data) {
  console.log(data) // { from: 'en', to: 'fr' }
});

Check out our API documentation for a full list of available events.

CSS

Localize ensures the lang attribute of the <html> is always kept up to date.

This can be used to apply language-specific CSS rules, as in the following example:

html[lang=en] {
  // CSS rules for English
}
html[lang=fr] {
  // CSS rules for French
}

Check out our Library documentation for further detail.

Changing Non-Text Media Content


Swapping out images and links (to PDFs, for example) for each language.

Suggested Edits are limited on API Reference Pages

You can only suggest edits to Markdown body content, but not to the API spec.