【Ruby on Rails】Bootstrapを使ったヘッダー設定について

ヘッダー箇所にbootstrapを使用してレイアウトを調整していたのですが、
下記コードのbodyから7行目のにある「<% if user_signed_in? %>」から「<% end %>」までのリンク先が表示されません。

解決に向けて試した方法といたしまして、
それぞれの「link_to」の末尾に「class="nav-link"」とクラスを追記してみましたが、表示されないままでした。

リンク先が表示されるようにするには、現状のコードからどのように修正すればよろしいでしょうか。
下記コードについてご質問いただけましたら、コメント欄にて回答させていただきます。
ご教示のほど、何卒よろしくお願いいたします。

html
1<!DOCTYPE html>
2<html>
3  <head>
4    <title>Bookers3</title>
5    <%= csrf_meta_tags %>
6    <%= csp_meta_tag %>
7
8    <%= stylesheet_link_tag    'application', media: 'all', 'data-turbolinks-track': 'reload' %>
9    <%= javascript_include_tag 'application', 'data-turbolinks-track': 'reload' %>
10  </head>
11
12  <body>
13    <div class="container">
14      <div class="row">
15        <h3>Bookers</h3>
16        <div class="collapse navbar-collapse" id="navbarNav">
17          <ul class="navbar-nav" >
18ここから下が表示されません
19            <% if user_signed_in? %>
20            <li>
21              <%= link_to "Home", user_path(current_user.id) %>
22            </li>
23            <li>
24              <%= link_to "Users", users_path %>
25            </li>
26            <li>
27              <%= link_to "Books", books_path %>
28            <li>
29              <%= link_to "logout", destroy_user_session_path, method: :delete class="nav-link" %>
30            </li>
31            <% else %>
32            <li>
33              <%= link_to "Home", root_path %>
34            </li>
35            <li>
36              <%= link_to "About", about_path %>
37            </li>
38            <li>
39              <%= link_to "sign_up", new_user_registration_path %>
40            </li>
41            <li>
42              <%= link_to "login", new_user_session_path %>
43            </li>
44          <% end %>
45ここまでです
46          </ul>
47        </div>
48      </div>
49    </div>
50    <%= yield %>
51  </body>
52</html>
53

行動規範の内容に同意します

回答1件

ベストアンサー

ruby
1<% if user_signed_in? %>
2： # ログインしたら表示される内容
3<% end %>

ログインしていないのではないでしょうか？

Bootstrapのクラスの使い方が間違っていたため、期待通りの挙動をしていないだけでした。。。

erb
1# application.html.erbのbody部分
2
3<body>
4	<nav class="navbar navbar-expand-lg navbar-light bg-light">
5		<a class="navbar-brand" href="#">Bookers</a>
6		<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
7			<span class="navbar-toggler-icon"></span>
8		</button>
9
10		<div class="collapse navbar-collapse" id="navbarSupportedContent">
11			<ul class="navbar-nav mr-auto">
12				<% if user_signed_in? %>
13					<li class="nav-item">
14						<%= link_to "Home", user_path(current_user.id), class: "nav-link" %>
15					</li>
16					<li class="nav-item">
17						<%= link_to "Users", users_path, class: "nav-link" %>
18					</li>
19					<li class="nav-item">
20						<%= link_to "Books", books_path, class: "nav-link" %>
21					</li>
22					<li class="nav-item">
23						<%= link_to "logout", destroy_user_session_path, class: "nav-link", method: :delete %>
24					</li>
25				<% else %>
26					<li class="nav-item">
27						<%= link_to "Home", root_path, class: "nav-link" %>
28					</li>
29					<li class="nav-item">
30						<%= link_to "About", about_path, class: "nav-link" %>
31					</li>
32					<li class="nav-item">
33						<%= link_to "sign_up", new_user_registration_path, class: "nav-link" %>
34					</li>
35					<li class="nav-item">
36						<%= link_to "login", new_user_session_path, class: "nav-link" %>
37					</li>
38				<% end %>
39			</ul>
40		</div>
41	</nav>
42
43	<%= yield %>
44
45</body>

投稿2020/11/10 12:41

編集2020/11/11 04:39

no1knows

総合スコア3365

runban

2020/11/10 14:05

ご回答ありがとうございます。ただいま確認いたしましたが、現状ログインはしている状態でした、、もしかしてhtml以外に何か問題でもあるのでしょうか…？

no1knows

2020/11/10 15:01

<% if user_signed_in? %>　⇒　<% unless user_signed_in? %>に変更したらどうなりますか？

runban

2020/11/11 03:08

ifからunlessへ変更してみましたが、リンク先は表示されないままでした、

no1knows

2020/11/11 03:18

・ログインしたら表示される設定（if user_signed_in?）⇒表示されない・ログインしなければ表示される設定（unless user_signed_in）⇒表示されない > もしかしてhtml以外に何か問題でもあるのでしょうか…？ありそうですね。。。

no1knows

2020/11/11 03:26

認証はDeviseで良いですか？ログインしたときにリンクを表示したいということで良いですか？下記に変更して、ログインしたときに表示されますか？ログアウトしたら非表示になりますか？ <% if user_signed_in? %>　⇒　<% if current_user.present? %>

runban

2020/11/11 03:38

ご質問ありがとうございます。上記３点のご質問について、下記にて回答させていただきます。「認証はDeviseで良いですか？」 →はい、認証はdeviseのGemから機能を追加しています。「ログインしたときにリンクを表示したいということで良いですか？」 →ログインした時には「<% if>~<% else %>」まで、ログインしていない時には「<% else %>~<% end %>」までを表示できるようにしたいです。こちらのご説明が漏れており申し訳ございません、「下記に変更して、ログインしたときに表示されますか？ログアウトしたら非表示になりますか？」 →ただいま変更してみましたが、リンク先は表示されないままでした、

no1knows

2020/11/11 03:45

gitとかでソースを共有してもらうことは可能でしょうか？

runban

2020/11/11 03:49

承知いたしました。ただいまurlをお送りいたしますので、少々お待ちください。

runban

2020/11/11 03:54

URLをお送りいたします。 https://github.com/sugurunnba/Bookers2

runban

2020/11/11 04:51

解決いたしました！昨日から丁寧にご対応いただき、本当にありがとうございました！！

no1knows

2020/11/11 05:01

BootstrapなどのCSSフレームワークを利用する場合、 ①公式のコードをコピペする ②Railsのコードを挿入していくといった手順ですすめるとこのような間違いが少なくなります。（今回も公式コピペ、linkタグ挿入という手順で行いました。）自分のソースに、一つ一つBootstrapのクラスをつけていくと時間もかかり、エラーが頻発する原因となりますので、参考までに！

no1knows

2020/11/11 05:02

あぁ、あと僕がBootstrapをきちんと見ていなくて解決まで時間がかかってしまって申し訳なかったです。。。

runban

2020/11/11 06:21

問題箇所の解決に加えて、bootstrapの手順まで教えていただけるとは……！次回以降、bootstrapを使用する際はぜひ参考にさせていただきますね！いえいえそんなことないですよ！逆に私の質問した投稿内容が説明不足でした????‍♂️ また機会がございましたら、よろしくお願いいたします！

行動規範の内容に同意します