link_toでページ内ジャンプ機能を設定してみた - その辺にいるWebエンジニアの備忘録

こんにちは！kossyです！

さて、Railsのビューヘルパーであるlink_toでページ内リンク機能の設定方法について、
ブログに残してみました。

HTMLではaタグで実現できますが、link_toを使う場合はどのように実装すればいいのか、
少し詰まったので、備忘録として残しておきます。

環境
Rails 5.2.2
Ruby 2.5.1
Haml

anchorオプションで明示的にリンク先を指定する

HTMLではジャンプしたい箇所にidを設定し、aタグのパスにidを指定すれば
ページ内ジャンプ機能を実現できましたが、
link_toの場合はanchorを使えばページ内ジャンプ機能ができます。

app/views/home/index

%header
  = link_to "TOPIC", { anchor: "topic" }



.article#topic
  %h2
    トピック

こんな感じですね。

anchorオプションにidであるtopicを指定しています。