2015年1月14日水曜日

Middlemanの多言語化(i18n)対応する方法

Middlemanで日英の多言語化にi18nで対応する方法です。



公式ドキュメントは下記を参考にしてください。
Middleman 多言語化 (i18n)

config.rbの設定

activate :i18n, :langs => [:ja, :en]

langs配列に、仕様する言語を指定します。
先頭の物が、デフォルト設定されます。上記の記述であれば、日本語が優先されます。

http://localhost:4567/index.html で日本語ページ
http://localhost:4567/en/index.html で英語ページ

のようにアクセス可能になります。

対応ロケールのファイル作成

各ロケールのYAML形式のファイルを作成します。

日英のロケールファイルを作成する場合、/locales 配下に下記のファイルを作成します。

ja.yml 
en.yml

ファイルの内容は、

ja.yml

ja:
  title: "タイトル"

en.yml

en:
  title: "TITLE"

テンプレートファイル作成

多言語化するファイルは、/source/localizable 配下に配置します。

例えば、/source/localizable/index.html.erb を作成して、タイトルには下記のようにアクセス可能です。

<%= t('title') %>

上記をした場合、それぞのURLでは以下のように表示されます。

/index.html の場合

タイトル

/en/index.html の場合

TITLE

便利な使い方

配列とeachの利用

メニューなども多言語をしたい時に、ついでに配列に指定した値でループを回しながら、メニューを生成する方法です。

ja.yml

ja:
  menu:
    items:
      - name: '会社情報'
        href: '/outline/index.html'
      - name: '店舗情報'
        href: '/shop/index.html'
      - name: 'お問い合わせ'
        href: '/contact/index.html'

/source/localizable/_menu.html.erb

<ul>
  <% t('menu.items').each do |item| %>
      <li>
        <%= link_to item['name'], item['href'] %>
      </li>
  <% end %>
</ul>

以下のようなhtmlが生成されます。

<ul>
      <li>
        <a href="/outline/">会社情報</a>
      </li>
      <li>
        <a href="/shop/">店舗情報</a>
      </li>
      <li>
        <a href="/contact/">お問い合わせ</a>
      </li>
</ul>

0 件のコメント:

コメントを投稿

statistics