Magento2を日本語化する5つの方法とi18n翻訳処理の仕組み

2022年10月16日

イントロダクション

Magento2を日本語化するには5つの方法があります。

  • 公式日本語化パッケージを導入する
  • サードパーティ製日本語化パッケージを導入する
  • 自作オリジナルのLanguage Packages方式辞書を作成して導入する
  • 自作オリジナルのTranslation Dictionary方式辞書を作成して各コンポーネントへ適用する
  • インライン翻訳機能で設定する

各方法の詳細手順は下記の記事にて紹介していますので参考にしてください。

それぞれの方法のメリット・デメリットについて下記のような点があげられると思います。

日本語化の方法メリットデメリット
公式日本語化パッケージを導入する・将来的なMagnetoバージョンに対処したバージョンアップに期待できる・部分的に日本語がやや機械的で違和感を感じる部分がある
・コンポーネントを区別した翻訳文字定義がない
サードパーティ製日本語化パッケージを導入する・公式日本語化パッケージより自然な翻訳定義
・コンポーネントを区別した翻訳文字定義がある
・将来的なMagnetoバージョンに対処したバージョンアップの保証がない
自作オリジナルのLanguage Packages方式辞書を作成して導入する・コンポーネントを区別した翻訳文字定義ができる・ゼロから自作オリジナルの辞書を作成するのは大変手間
・Magentoバージョンアップ時にコマンド再適用が必要
自作オリジナルのTranslation Dictionary方式辞書を作成して各コンポーネントへ適用する・定義形式が単純でわかりやすい・ゼロから自作オリジナルの辞書を作成するのは大変手間
・コンポーネントを区別した翻訳文字定義ができない
インライン翻訳機能で設定する画面をみながら直感的に翻訳文字設定ができる・→公開中ストアに対して編集設定作業したい場合、作業中はWebサーバー設定でIP制限をかけるなど対処が必要
・コンポーネントを区別した翻訳文字定義ができない

(※)本記事執筆時のMagentoバージョンは2.4.5になります。

Magentoのi18n翻訳処理の仕組みについて

Magentoアプリケーションは、プログラム内において、i18n翻訳テキストの書式で書かれた部分を現在のロケール設定に従い、i18n辞書を参照して翻訳置換して表示します。(i18nローカライゼーション)

ロケール設定について

  • フロントエンド画面は “General>Locale Options>Locale" の設定
  • バックエンド画面(管理画面)は各管理者ユーザーの “Account Information>Interface Locale" の設定。

i18n辞書のデータ管理と参照優先度

下記はロケールが"ja_JP"の場合

翻訳方式データ配置場所参照優先度
Language Packages方式<module_dir>/i18n/ja_JP.csv
Translation Dictionary方式app/i18n/<vender_name>/<module_name>/ja_JP.csv
<parent_theme_dir>/i18n/ja_JP.csv
<current_theme_dir>/i18n/ja_JP.csv
インライン翻訳機能Magentoデータベースの “translation" テーブル

参照優先度とは、同じ i18n翻訳テキスト定義があった場合に優先されるi18n辞書データ。

例)i18n翻訳テキスト “hoge" に対する翻訳定義が下記のような場合

<module_dir>/i18n/ja_JP.csv ファイルの内容

hoge,ほげ1

Magentoデータベースの “translation" テーブルの内容

key_idstringtranslatelocale
Nhogeほげ2ja_JP

この場合、参照優先度の高い “ほげ2" が採用されて表示されます。

i18n翻訳テキストの書式

Magentoプログラム内において、i18n対応した文字列テキストは次のようなフォーマットで記述するルールとなっています。
(※)下記の例の “<Any Characters>" の部分に任意の半角英数・記号文字。

ページテンプレート・ファイル(.phtml)

ページテンプレート用(拡張子.phtml)のファイル内の phpコード記述内において、
書式 __ ('<Any Characters>’) で記述します。

例) ./vender/magento/module-customer/view/frontend/templates/address/book.phtml

<strong><?= $block->escapeHtml(__('Default Addresses')) ?></strong>

メールテンプレート

ページテンプレート用ファイル又は、バックエンド画面のメールテンプレート設定(Marketing > Communications > Email Template)において、
書式 {{trans “<Any Characters>"}} で記述します。

例)./vender/magento/module-newsletter/view/frontend/email/subscr_success.html

<p>{{trans "You have been successfully subscribed to our newsletter."}}</p>

UIコンポーネントテンプレート

UIコンポーネント(Knockout.jsフレームワーク記述)のhtmlファイル(拡張子.html)において、
書式 i18n: '<Any Characters>' で記述します。

例)./vender/magento/module-sales-rule/view/frontend/web/template/payment/discount.html

<span><!-- ko i18n: 'Apply Discount'--><!-- /ko --></span>

JavaScript・ファイル(.js)

JavaScriptファイル(拡張子.js)において
書式 $.mage.__(<Any Characters>) で記述します。

例)./vender/magento/module-multishipping/view/frontend/web/js/payment.js

alert({
      content: $.mage.__('Please choose a payment method.')
});

xml定義ファイル(.xml)

各種XML形式の定義ファイル(拡張子.xml)において
該当エレメントに対するtranslate属性指定を記述してi18n文字列扱いであることを表現します。

例)./vender/magento/module-customer/etc/adminhtml/system.xml

<field id="auto_group_assign" translate="label" type="select" sortOrder="10" showInDefault="1" showInWebsite="1" showInStore="1" canRestore="1">
    <label>Enable Automatic Assignment to Customer Group</label>
    <source_model>Magento\Config\Model\Config\Source\Yesno</source_model>
</field>

結局どうしたらよいの?

ゼロから自作オリジナルの辞書を作成するのは大変手間がかかる作業でおすすめしません。筆者のおすすめの方法は、まず最初に、公式日本語化パッケージ 又は サードパティ製日本語化パッケージ を導入して、その後いくつかのテキスト微調整したい部分があれば、ストア設定されているThemeファイル内の ja_JP.csv で必要定義のみ設定するのが効率的に表示を日本語化できる方法だと思います。
この手順については、こちらの “テーマコンポーネントから日本語表示調整" の記事で紹介しています。

なお、これらi18nローカライゼーションは、文字の表示を原文の英語から日本語に置き換えるものです。日本語の慣習にあった名前(姓・名)の表示順序の調整、住所表記の調整、また通貨表示(小数点の除去)などはされません。管理人が作成した “Adjust Address Info For Japanese”エクステンション, “Hide Price Zero Decimal”エクステンション を導入することでそれらの調整が手軽に実装できます。ぜひご検討ください。