おれんじりりぃぶろぐ

きっと何者にもなれないエンジニアのブログ

Rails4でbootstrap3のGlyphiconsを使う方法

嵌ったのでメモ。

この方法でbootstrapを入れた場合、下記のように記述するだけではGlyphiconsが上手く表示されない(´;ω;`)

<span class="glyphicon glyphicon-trash" aria-hidden="true"></span>

対策

app/assets/stylesheets/bootstrap_and_overrides.css.less中の
// @import "twitter/bootstrap/glyphicons.less";コメントアウトを外す。

app/assets/stylesheets/bootstrap_and_overrides.css.less

// Glyphiconss
@import "twitter/bootstrap/glyphicons.less";

さらに以下を同じファイル中に追記する。

app/assets/stylesheets/bootstrap_and_overrides.css.less

@font-face {
  font-family: 'Glyphicons Halflings';
  src: url('/assets/glyphicons-halflings-regular.eot');
  src: url('/assets/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'), url('/assets/glyphicons-halflings-regular.woff') format('woff'), url('/assets/glyphicons-halflings-regular.ttf') format('truetype'), url('/assets/glyphicons-halflings-regular.svg#glyphicons-halflingsregular') format('svg');
}

しっかり表示されるようになりました\(^o^)/