i18nによる日本語化
i18nを使用しユーザー登録画面とログイン画面を日本語化する。
i18n国際化(Internationalization)はRailsにおいて、言語の翻訳機能があるgemである。
実行環境
- Rails5.2.3
- Ruby2.6.4
gem 'rails-i18n'をGemfileに記述し、bundleする。
# rails5系なら以下を記述 gem 'rails-i18n', '~> 5.1' # rails4系なら以下を記述 gem 'rails-i18n', '~> 4.0'
config/application.rbにデフォルトの言語を日本語にする設定とロケールファイルを読み込むPATHを設定。
config.i18n.default_locale = :ja config.i18n.load_path += Dir[Rails.root.join('config', 'locales', '**', '*.{rb,yml}').to_s]
config/locales以下にロケールファイルを作成する。
モデル名、モデル属性に関する日本語化はactiverecord/ja.ymlに記述。
ビューに関する日本語化はviews/ja.ymlに記述。
モデル側の日本語化
モデルは全て activerecord 以下に記述する。 models以下に日本語化するモデルを指定、attributes以下にはモデルの属性を指定する。
ユーザー登録画面 modelに関する翻訳ファイル
ja: activerecord: models: user: 'ユーザー' attributes: user: last_name: '姓' first_name: '名' email: 'メールアドレス' password: 'パスワード' password_confirmation: 'パスワード確認'
Modelに紐づくform_withのlabelはRailsがロケートファイルの翻訳を適応してくれる。 一方でform_withの引数にModelを渡してないときはモデルと紐付いていないので、label自身に翻訳を適応する記述をする必要がある。また、国際化の際はlazy lookup機能を使用する。
<%= form_with model:@user, local: true do |f| %> <div class="form-group"> <%= f.label :last_name %> <%= f.text_field :last_name, class: 'form-control', id: 'user_last_name' %> </div> <div class="form-group"> <%= f.label :first_name %> <%= f.text_field :first_name, class: 'form-control', id: 'user_first_name' %> </div> <div class="form-group"> <%= f.label :email %> <%= f.text_field :email, class: 'form-control', id: 'user_email' %> </div> <div class="form-group"> <%= f.label :password %> <%= f.password_field :password, class: 'form-control', id: 'user_password' %> </div> <div class="form-group"> <%= f.label :password_confirmation %> <%= f.password_field :password_confirmation, class: 'form-control', id: 'user_password_confirmation' %> </div> <%= f.submit (t 'defaults.register'), class: 'btn btn-primary'%> <%end%> <div class='text-center'> <%= link_to (t 'defaults.to_login_page'), login_path%>
view側の日本語化
ログイン画面 viewに関する翻訳ファイル
ja: defaults: login: 'ログイン' register: '登録' title: 'ユーザー登録' to_login_page: 'ログインページへ' user_sessions: new: Back: '戻る' title: 'ログイン' email: 'メールアドレス' password: 'パスワード' to_register_page: '登録ページへ'
ログイン画面はform_withの引数がurlでモデルと紐付いていないのでlabelに翻訳を適応させる記述をする。 Model.human_attribute_name(:カラム名)で属性名を取得する。
<%= link_to (t '.Back'), users_path %> <div class="container"> <div class="row"> <div class=" col-md-10 offset-md-1 col-lg-8 offset-lg-2"> <h1><%= t '.title' %></h1> <%= form_with url: login_path, local: true do |f| %> <div class="form-group"> <%= f.label :email, User.human_attribute_name(:email) %> <%= f.text_field :email, class: "form-control" %> </div> <div class="form-group"> <%= f.label :password, User.human_attribute_name(:password) %> <%= f.password_field :password, class:"form-control" %> </div> <div class="actions"> <%= f.submit (t 'defaults.login'), class: "btn btn-primary" %> </div> <% end %> <div class='text-center'> <%= link_to (t '.to_register_page'), new_user_path %>