Локализация расширения

Итак, пользователи Вашего расширения уже могут самостоятельно изменять выводимый на экран текст. Но тут Вы вспоминаете, что не зря же Вы 7 лет учили английский язык в школе?!

Принимаем решение: наше расширение помимо русского должно также понимать английский язык. Для локализации или, как это принято называть в Google Chrome Extension, интернационализации (i18n) в корневой каталог расширения необходимо поместить папку _locales, в которой в свою очередь создать папки с двухсимвольным обозначением языков локализации расширения. В нашем случае это будут папки ru и en. В каждой папке будет находиться только один текстовый файл с именем messages.json. Все поддерживаемые языки локализации приведены в таблице.

Структура файла messages.json довольно проста:

{
  "name": {
    "message": "Текст сообщения, который может содержать необязательные шаблоны (placeholders).",
    "description": "Описание сообщения для переводчиков.",
    "placeholders": {
      "placeholder_name": {
        "content": "Строка, которая будет помещена в сообщение.",
        "example": "Пример строки шаблона (placeholder) для переводчика."
      },
      ...
    }
  },
  ...
}

где name – имя переменной, используемой в манифесте (manifest.json), CSS-файлах и JavaScript-коде расширения. Обязательными являются только поля name и message. Имя шаблона внутри сообщения должно быть обрамлено символами доллара с обеих сторон $placeholder_name$, а чтобы вставить в текст сообщения символ доллара, необходимо указать его дважды $$.

В манифесте и CSS-файлах имя переменной должно выглядеть так:

__MSG_name__

а для JavaScript API Chrome предусматривает использование метода

chrome.i18n.getMessage("name")

Следует заметить, что если в корневом каталоге расширения размещена папка _locales, то в манифесте в обязательном порядке должен быть указан язык по умолчанию:

{
   …
  "default_locale": "ru",
  …
}

Очевидно, что подпапка с указанным языком и соответствующим файлом messages.json должна существовать.

Есть несколько предопределенный сообщений:

@@extension_id – ID расширения. Вы можете использовать эту строку для построения URL-адресов для ресурсов внутри расширения. Даже нелокализованные расширения могут использовать это сообщение. Однако, Вы не можете использовать это сообщение в файле манифеста.

@@ui_locale – текущая локализация. Вы можете использовать эту строку для создания зависимого от используемого языка URL.

@@bidi_dir, @@bidi_reversed_dir, @@bidi_start_edge, @@bidi_end_edge – информация, связанная с направлением написания текста сообщений для текущего языка.

Ну вот собственно и всё, что следует знать, прежде чем приступать к локализации нашего расширения.

Сначала внесем соответствующие изменения в файл манифеста, а именно: заменим русский текст названиями переменных и добавим язык по умолчанию:

{
  "name": "__MSG_chrome_extension_name__",
  "version": "3.0",
  "manifest_version": 2,
  "default_locale": "ru",
  "description": "__MSG_chrome_extension_description__",
  "options_page": "options.html",
   "icons": {
      "128": "128.png",
      "48": "48.png",
      "32": "32.png",
      "16": "16.png"
   },
  "browser_action": {
    "default_title": "__MSG_chrome_extension_title__",
    "default_icon": "32.png",
    "popup": "popup.html"
  }
}

Теперь создадим файл messages.json на русском языке:

{
   "chrome_extension_description": {
      "description": "Сhrome extension description",
      "message": "Моё первое расширение."
   },
   "chrome_extension_name": {
      "description": "Сhrome extension name",
      "message": "Расширение Привет, Мир!"
   },
   "chrome_extension_title": {
      "description": "Сhrome extension button description",
      "message": "Моё первое расширение:\nПривет, Мир!"
   },

   "msg_title1": {
      "message": "Текст: "
   },
   "msg_text1": {
      "message": "Привет, Мир!"
   },
   "msg_text2": {
      "message": "Я сделал это!"
   },
   "msg_text3": {
      "message": "Я люблю Chrome"
   },
   "msg_title2": {
      "message": "Показать версию расширения"
   },
   "msg_version": {
      "message": "Версия: "
   },

   "lang": {
      "message": "ru"
   }
}

И его локальную копию на английском языке. Аналогичные можете сделать еще и на других необходимых языках и просто добавить локальные копии, например на французском и итальянском.

Теперь осталось лишь заменить в файлах popup.html и options.html русский текст вызовом метода chrome.i18n.getMessage("name"), с указанием соответствующей переменной в качестве аргумента.

Собираем расширение - готовo.