WordPress Bones Webフォントでアイコン表示

このブログのアイコンは無料のWebフォントLigature Symbolsを利用しています。
かわいいフォントは@kudakurageさんが作成されています。

このwebフォントを使うための設定を_typography.scssファイルに追記します。
_typography.scssファイルの場所はlibrary/scss/partials/_typography.scssになります。

フォントはLigature Symbolsからダウンロードします。
Ligature Symbolsのサイトにスタイルシートの設定が掲載されています。

ダウンロードしたフォントを任意のフォルダに入れます。
例えばlib/font/の中にフォントを入れた場合は以下の設定になります。

個々のアイコンを使うためのCSSは以下のようになります。

  • このサイト内で使用しているアイコンは
  • パンくずリストのホームアイコン
  • スマートフォン用のメニューボタン
  • 検索フォームの虫めがね
  • フォルダ
  • タグ
  • ←リストの先頭につけるやじるし

htmlに設定するときはクラス名にlsf-iconと表示したいアイコンのクラス名を入れます。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

Share・Feedly