はじめに
ウェブページ内にメニューバーやFacebook、instagram、twitterなどのアイコンを入れたいと思った時にFont awesomeが使える。
Font awesomeとは
無料で使えるウェブフォントアイコンである。
サイト:Font awesome
使い方
Gemfileにfont-awesome-sassを追加し、bundle installする。
Gemfile
gem 'font-awesome-sass' #追加しbundle install後、サーバーを立ち上げ直す
bundle install後、サーバーを立ち上げ直し、
application.scssファイルにfont-awesome-sprocketsとfont-awesomeを追加。
読み込む順番が異なるとアイコンが読み込まれないので注意が必要。
app/assets/stylesheets/application.scss
@import "font-awesome-sprockets";
@import "font-awesome";
ビューに欲しいアイコン（今回は、class="fas fa-bars"のfasとfa-以降の部分barsを使用）を入力する。
iconはfont-awesome-sassのgemのヘルパーメソッド。
app/views/chats/index.html.haml
= icon('fas', 'bars')
これで、ウェブページにFont awesomeのアイコンを入れることができる