読者です 読者をやめる 読者になる 読者になる

Rails Webook

自社のECを開発している会社で働いています。Rails情報やサービスを成長させる方法を書いていきます

Rails4でページごとにページのタイトル(titleタグ)の内容を変更する

Rails Tips

f:id:nipe880324:20141206143413p:plain:w420

Railsでページごとにページタイトル(titleタグ)を変更するTipsを説明します。


動作確認

  • Rails 4.1

1. タイトルを設定するヘルパーメソッドを作成

タイトルを設定するメソッドを追加します。
page_titleがからの場合、base_titleしか表示しないようにしています。

# app/helpers/application_helper.rb
module ApplicationHelper
  def full_title(page_title)
    base_title = "アプリ名" # 自分のアプリ名を設定する
    if page_title.empty?
      base_title
    else
      "#{page_title} | #{base_title}"
    end
  end
end

2. レイアウトの>title<タグからヘルパーメソッドを使う

レイアウトファイルのtitleタグを書き換えます。

# app/views/layouts/applicaiton.html.erb
<title><%= full_title(yield(:title)) %></title>

3. それぞれの部分テンプレートでtitleに値を設定する

新規画面でtitleに値を設定します。

# app/views/users/new.html.erb
<!-- 一番上に追加 -->
<% provide(:title, "ユーザー作成") %>


同様に編集画面でもtitleに値を設定します。

# app/views/users/edit.html.erb
<!-- 一番上に追加 -->
<% provide(:title, "ユーザー編集") %>

4. 動作確認

サーバーを起動し、タイトルを確認してみます。
一覧画面にアクセスすると、titleを設定していないので、「アプリ名」のみが表示されます。

f:id:nipe880324:20141206143927p:plain:w420


新規画面にアクセスすると、「ユーザー作成 | アプリ名」と表示されています。
f:id:nipe880324:20141206144016p:plain:w420


同様に編集画面にアクセスすると、「ユーザー編集 | アプリ名」と表示されています。
f:id:nipe880324:20141206144027p:plain:w420


以上です。