March 2, 2013

Chrome Extensionのメッセージを国際化してみた

以下、関連する公式ドキュメントです。
http://developer.chrome.com/extensions/i18n.html

HTML上に記述するメッセージを国際化するサンプルが見当たらなかったので、以下の方法でやってみました。

_locales/xx/messages.jsonは、以下のようになります。
{
    "page1_message1": {
        "message": "page1_message1_string"
    },
    "page1_message2": {
        "message": "page1_message2_string"
    },
    "page2_message1": {
        "message": "page2_message1_string"
    },
    "page2_message2": {
        "message": "page2_message2_string"
    }
}
専用のjsファイルを用意します。(locale.jsとしました。)
$(document).ready(function() {
    $(".locale").each(function() {
        classes = $(this).attr("class").split(" ");
        $("." + classes[1]).text(chrome.i18n.getMessage(classes[1]));
    });
});
このjsをHTML側で読み込んで、"page1_message1"を当てはめるタグであれば、以下のようにします。
<span class="locale page1_message1"></span>
実際にHTMLを表示して、言語設定毎に正しいメッセージが反映されていればOKです。

Chromeの言語設定については、以下が参考になります。
http://support.google.com/chrome/bin/answer.py?hl=ja&answer=95416

No comments:

Post a Comment