LoginSignup
0
0

More than 3 years have passed since last update.

Ruby on Rails navbar-brandにリンクを付けたい

Last updated at Posted at 2020-08-21

初めに

Railsを学習中の際、タイトルの部分を押せばトップページに戻るようにしたかったのですが、少し手間取ったので記事にする事にしました。なので、メモ程度だと思って見て頂ければ幸いです。

本題

何をしたかったのか?

以下の画像にある、この赤い部分を押せばサイトのトップに戻るようにしたかった。「app/views/layouts/application.html.slim」を利用してこの部分は作成していたので、このファイルのコードを添付しておきます。
image.png

application.html.slim
doctype html
html
  head
    meta charset = "utf-8"
    title TaskTest
    = csrf_meta_tags
    = csp_meta_tag
    = stylesheet_link_tag    'application', media: 'all', 'data-turbolinks-track': 'reload'
    = javascript_include_tag 'application', 'data-turbolinks-track': 'reload'
  body
    .app-title.navbar.navbar-expand-md.navbar-light.bg-light
      .navbar-brand TaskTest
      .container
        - if flash.notice.present?
          .alert.alert-success= flash.notice
    = yield

変更した要所のみを載せます。navbar-brandの横にhrefでトップページに飛ばそうとしても上手くいきませんでした。しかし、以下のように下にaタグを設定することによってタイトルを押すとトップページに戻れるようになりました。

application.html.slim
  body
    .app-title.navbar.navbar-expand-md.navbar-light.bg-light
      .navbar-brand
        a class="title" href="/"  TaskTest
      .container
        - if flash.notice.present?
          .alert.alert-success= flash.notice
    = yield

最後に

slim形式で書くことに慣れていないのでこれが最適解なのかは分かりませんが、これからの勉強に役立てていきたいと思います。

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0