👼

【Rails】ページごとにヘッダーを表示/非表示を切り替える方法

2023/08/18に公開

Rails

Ruby

header

tech

ページによってはヘッダーを非表示にしたい！と思ったので、そのやり方の解説です！
アプローチは以下2つ。

CSSで非表示にする
コントローラでの条件付け

それぞれ説明していきます。

1. CSSで非表示

非表示にしたいページのスタイルを変更する。

<style>
  /* ヘッダーを非表示にする */
  #header {
    display: none;
  }
</style>

ただヘッダーを隠すだけの処理。

2. コントローラでの条件付け

基本はヘッダーを表示させる！という前提で解説します。

application.html.erbの設定

ヘッダーを部分テンプレートにして、if文をつけてあげる。

app/views/layouts/application.html.erb

<!DOCTYPE html>
<html>
  <head>
    :
  </head>

  <body>
    <% if @show_header %>
      <%= render 'layouts/header' %>
    <% end %>
    :
　</body>
</html>

application_controllerの設定

デフォルトでヘッダーを表示させるようにする。

app/controllers/application_controller.rb

class ApplicationController < ActionController::Base
  before_action :set_header_visibility

  private

  def set_header_visibility
    @show_header = true # デフォルトはヘッダーを表示する
  end
end

非表示にさせたいcontrollerの設定

特定のアクションでヘッダーを非表示にする。
praivate以下にメソッドを作り、before_actionで呼び出す。

特定のcontroller

class Public::UsersController < ApplicationController
  before_action :hide_header, only: [:follower_list]

  :

  def follower_list
    @followers = @user.followers
  end

  private

  def hide_header
    @show_header = false # フォロワーリストアクションではヘッダーを非表示に
  end
end

これでfollower_listページはヘッダーが表示されなくなりました。