はじめに

今回は、railsにてhamlを用いてXのリンク先に飛べるボタンを作り方を簡単にまとめたいと思います。

１.HAMLでのリンク生成

まず、HAMLファイルでリンクを生成する方法についてです。
以下のコードでXとInstagramとTikTokリンクに飛べる箱ができます。

= link_to 'X', '<XのURL>', target: '_blank', class: 'box', rel: 'noopener'

hamlで直接リンクを挿入した場合、コントーラーファイルに以下のコードを設定する必要があります。

@talent.x_url = '<XのURL>'

以下のcssは基本的なスタイルになります。
あとは好みで追加してください！

.box {
  padding: 10px 20px;
  border: 1px solid #777;
  text-align: center;
  color: #333;
  padding: 8px;
}

この記事では、Ruby on Railsを使用して、リンク先に飛べるものを作成する方法をご紹介しました。簡単なコードですが、実際のプロジェクトで多様に応用できる要素です。ぜひ使ってみてください。