Ruby and Rails

Ruby と Ruby on Rails のこと

font-awesome-rails は本当に Awesome

bokmann/font-awesome-rails を使うと、簡単に Font Awesome を導入できる。

インストール

Gemfile に追加。

gem 'font-awesome-rails'

インストール。

$ bundle

./app/assets/stylesheets/application.css に追加。

 *= require font-awesome

使い方

fa_icon の後ろに Font Awesome Icons の名前を書くだけ。

ただし、頭の fa- は不要。例えば fa-camera-retro なら camera-retro になる。

<%= fa_icon 'camera-retro' %>

横にテキストを追加するなら。

<%= fa_icon 'camera-retro', text: 'Take a photo' %>

テキストの右側に配置も可能。

<%= fa_icon 'chevron-right', text: 'Get started', right: true %>

アイコン同士の合成もできる。

<%= fa_stacked_icon 'twitter',  base: 'circle-o' %>
<%= fa_stacked_icon 'twitter',  base: 'sqare-o' %>
<%= fa_stacked_icon 'twitter',  base: 'sun-o' %>

class 指定も可能だし、4x と書けば 4 倍の大きさになる。

<%= fa_icon 'quote-left 4x', class: 'text-muted pull-left' %>

本当に便利。

おまけ : Evil Icons

Evil Icons も font-awsome-rails のように扱えます。