i18nによる日本語化
７．i18nによる日本語化
Rails2.2から様々な言語に対応できるように、国際化i18n(internationalizationの頭と後ろのiとn、文字数が18文字)が標準で搭載されました。
この機能によりラベル名やエラーメッセージなどの日本語化が簡単にできるようになります。
提供されたプログラムを特定の言語に対応させることを地域化L10N(localization)といい、Railsでもいままで様々な地域化の試みが行われてきていましたが、これはその集大成に位置するものと考えると分かりやすいかもしれません。
引き続いてプロジェクトAppli000を使って日本語化を説明します。
7-1.日本語化の準備
(1) amatsuda-i18nのインストール
コマンド プロンプトC:\Ruby>gem sources -a http://gems.github.com
http://gems.gethub.com added to sourcesC:\Ruby>gem install amatsuda-i18n_generators
Successfully installed locale-2.0.5
Successfully installed gettext-2.0.5
Successfully installed amatsuda-i18n_generators-0.6.0
3 gem installed
Installing ri documentation for locale-2.0.5...
Installing ri documentation for gettext-2.0.5...
Installing RDoc documentation for locale-2.0.5...
Installing RDoc documentation for gettext-2.0.5...
7-2.i18nによる生成
(1) 日本語のリソースファイルの生成
対象とするプロジェクトにディレクトリを移してから実行します。
コマンド プロンプトD:\Rails_Projects\Appli000>ruby script/generate i18n ja
debug updating environment.rb ...
debug fetching ja.yml fro rails-i18n repository...
exists config/locales
update config/environment.rb
create config/locales/ja.yml
debug 1 models found.
debug 0 translating activerecord.models.address ...
debug translating activerecord.attributes.address.namae ...
debug translating activerecord.attributes.address.yubin ...
debug translating activerecord.attributes.address.jusho ...
debug translating activerecord.attributes.address.denwa ...
debug took 1.172 secs to translate.
create config/locales/translation_ja.yml
(2) jp.ymlの内容確認
ja.ymlのソースを確認してください。どのように日本語変換されるかよく分かります。
/config/locales/ja.yml# Japanese translations for Ruby on Rails
# by Akira Matsuda (ronnie@dio.jp)
# AR error messages are basically taken from Ruby-GetText-Package. Thanks to Masao Mutoh.ja:
date:
formats:
default: "%Y/%m/%d"
short: "%m/%d"
long: "%Y年%m月%d日(%a)"day_names: [日曜日, 月曜日, 火曜日, 水曜日, 木曜日, 金曜日, 土曜日]
abbr_day_names: [日, 月, 火, 水, 木, 金, 土]
：
：
activerecord:
errors:
template:
header:
one: "{{model}}にエラーが発生しました。"
other: "{{model}}に{{count}}つのエラーが発生しました。"
body: "次の項目を確認してください。"messages:
inclusion: "は一覧にありません。"
exclusion: "は予約されています。"
invalid: "は不正な値です。"
confirmation: "が一致しません。"
accepted: "を受諾してください。"
empty: "を入力してください。"
blank: "を入力してください。"
too_long: "は{{count}}文字以内で入力してください。"
too_short: "は{{count}}文字以上で入力してください。"
wrong_length: "は{{count}}文字で入力してください。"
taken: "はすでに存在します。"
not_a_number: "は数値で入力してください。"
greater_than: "は{{count}}より大きい値にしてください。"
greater_than_or_equal_to: "は{{count}}以上の値にしてください。"
equal_to: "は{{count}}にしてください。"
less_than: "は{{count}}より小さい値にしてください。"
less_than_or_equal_to: "は{{count}}以下の値にしてください。"
odd: "は奇数にしてください。"
even: "は偶数にしてください。"
record_invalid: "バリデーションに失敗しました。 {{errors}}"full_messages:
format: "{{attribute}}{{message}}"
(3) 動作確認
WEBrickを再立ち上げして実行します。
エラーメッセージが日本語になりました。
(4) translation_ja.ymlの更新
メッセージは日本語化されましたが、メッセージの中のテーブル名や項目名はひらがなや英字です。
これはtranslation_ja.ymlを修正することで解決します。
/config/locales/translation_ja.ymlja:
activerecord:
models:
address: "住所" #g
address: "住所録"attributes:
address:
namae: "なまえ" #g
yubin: "ゆうびん" #g
jusho: "Jusho" #g
denwa: "でんわ" #g
namae: "名前"
yubin: "郵便番号"
jusho: "住所"
denwa: "電話"
7-3.ラベル部分の日本語化
(1) translation_ja.ymlの修正
いまはタイトルやラベルは英字のままです。ここも日本語化しましょう。
translation_ja.ymlに変換コードを追加することで日本語化できます。
/config/locales/translation_ja.ymlja:
activerecord:
models:
address: 住所録
attributes:
address:
namae: 名前
yubin: 郵便
jusho: 住所
denwa: 電話
label:
Editing_address: 住所録の更新
Listing_addresses: 住所録一覧
New_address: 住所録への新規登録
Namae: 名前
Yubin: 郵便
Jusho: 住所
Denwa: 電話
Are_you_sure?: 削除してよろしいですか？
link:
New_address: 追加
Show: 表示
Edit: 編集
Destroy: 削除
Back: 前画面
button:
Create: 新規登録実行
Update: 更新実行
(2) ビューのプログラム修正
app/views/addresses/edit.html.erb
app/views/addresses/index.html.erb
app/views/addresses/new.html.erb
app/views/addresses/show.html.erb
該当箇所を<%= t(label.Namae) %>と記述することで"名前"となります。
/app/views/addresses/index.html.erb<br/>
<h1><%= t('label.Listing_addresses') %></h1><table>
<tr>
<th><%= t('label.Namae') %></th>
<th><%= t('label.Yubin') %></th>
<th><%= t('label.Jusho') %></th>
<th><%= t('label.Denwa') %></th>
</tr><% for address in @addresses %>
<tr>
<td><%=h address.namae %></td>
<td><%=h address.yubin %></td>
<td><%=h address.jusho %></td>
<td><%=h address.denwa %></td>
<td><%= link_to t('link.Show'), address %></td>
<td><%= link_to t('link.Edit'), edit_address_path(address) %></td>
<td>>%= link_to t('link.Destroy'), address,
:confirm => t('label.Are_you_sure?'), :method => :delete %></td>
</tr><% end %>
</table><div class="pagination_link">
<%= will_paginate @addresses %>
</div><br /><%= link_to t('link.New_address'), new_address_path %>
(3) Webブラウザで確認
（indexの画面）
（Newの画面）
7-4.Paginateの日本語化
(1) index.html.erbの修正
indexの画面を見るとPaginateの部分だけが日本語化されていません。
これを日本語化するにはwill-paginateの指定部分でオプションを付けることで解決します。
/app/views/addresses/index.html.erb<br/>
<h1><%= t('label.Listing_addresses') %></h1><table>
<tr>
<th><%= t('label.Namae') %></th>
<th><%= t('label.Yubin') %></th>
<th><%= t('label.Jusho') %></th>
<th><%= t('label.Denwa') %></th>
</tr><% for address in @addresses %>
<tr>
<td><%=h address.namae %></td>
<td><%=h address.yubin %></td>
<td><%=h address.jusho %></td>
<td><%=h address.denwa %></td>
<td><%= link_to t('link.Show'), address %></td>
<td><%= link_to t('link.Edit'), edit_address_path(address) %></td>
<td>>%= link_to t('link.Destroy'), address,
:confirm => t('label.Are_you_sure?'), :method => :delete %></td>
</tr><% end %>
</table><div class="pagination_link">
<%= will_paginate @addresses, :prev_label => "« 前", :next_label => "次 »" %>
</div><br /><%= link_to t('link.New_address'), new_address_path %>
(2) ブラウザによる動作確認
paginateの部分も日本語化されました。
(3) Paginateのスタイルシート
paginateにスタイルシートを適用すると、いろいろな形式の表示が可能となります。
ここでは一例として、will_paginate.cssを使ったサンプルを示します。
/public/stylesheets/will_paginate.css/* スタイルシート: public/stylesheets/will_paginate.css */
.pagination {
padding: 3px;
margin: 3px;
}
.pagination a {
padding: 2px 5px 2px 5px;
margin: 2px;
border: 1px solid #aaaadd; /* ノーマルどきの枠の色 default: #aaaadd */
text-decoration: none;
color: #009900; /* ノーマルどきの文字の色 default: #000099 */
}
.pagination a:hover, .pagination a:active {
border: 1px solid #009900; /* カーソルが乗ったときの枠の色 default: #000099 */
color: #fff; /* カーソルが乗ったときの文字の色 default: #000 */
}
.pagination span.current {
padding: 2px 5px 2px 5px;
margin: 2px;
border: 1px solid #009900; /* カレントの枠の色 default: #000099 */
font-weight: bold;
background-color: #009900; /* カレントの背景色 default: #000099 */
color: #FFF; /* カレントの文字の色 default: #FFF */
}
.pagination span.disabled {
padding: 2px 5px 2px 5px;
margin: 2px;
border: 1px solid #eee; /* 範囲外の枠の色 default: #eee */
color: #ddd; /* 範囲外の文字の色 default: #ddd */
}
(4) スタイルシートの読み込み
作成したスタイルシートを読み込む処理をプログラムに組み入れます。
/app/views/layouts/addresses.html.erb<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="content-type" content="text/html;charset=UTF-8" />
<title>Addresses: <%= controller.action_name %></title>
<%= stylesheet_link_tag 'scaffold', 'will_paginate' %>
</head>
<body><p style="color: green"><%= flash[:notice] %></p><%= yield %>
</body>
</html>
(5) ブラウザによる動作確認
WEBrickを再起動して実行します。
