More than 5 years have passed since last update.

【Rails】「link_to」でaタグ内に画像を設置したい

Last updated at 2019-10-13Posted at 2019-10-13

##開始タグ
画像リンクを設置したくて色々と調べたのでメモ。

##方法

###画像リンク
シンプルでlink_to内のテキスト部分をimage_tagに置き換えるだけ。

sample.html.erb

  <%= link_to image_tag("img_logo.png"), "/" %>

###画像（imgタグ）にclass名をつける
その場合は引数を追加すればOK。

sample.html.erb

  <%= link_to image_tag("img_logo.png", class:"image_switch"), "/" %>

※複数のクラス名をつけたい場合は、スペースを１個入れて書いてあげればOK

###dataから始まる属性値を追加したい
試しにdata-actionとそのまま追加してみましたが、エラーが出て上手くいかず・・・。
どうやらdata:オプションで指定してあげればdata-以降の属性値は自由に設定できるみたい。

sample.html.erb

  <%= link_to image_tag("img_logo.png", data: { test: "test_tekitou" }, "/" %>

というか単純に「link_to内でできることは、imgタグへ対しても適用できる」ということだよね。
慣れてきたらまとめよう、うん。

##追加で学んだこと
・link_toはヘルパーメソッドと呼ばれるもの。
・「ヘルパーメソッド」とは、ビューファイルに記述できるメソッドのこと。

・「ただリンクさせるだけならaタグ使えばいいんじゃ？」
→link_toを使用することでrailsに最適化したaタグをコンパイルしてくれるようですので、今後迷わずlink_toを使用していこう。