スポンサーリンク

【Luxeritas】マテリアルアイコンを使うための設定

Luxeritas

WordPressテーマ Luxeritas(ルクセリタス) バージョン3.18.0よりマテリアルアイコンが標準搭載されました!

マテリアルアイコンはGoogleが提供しているWebアイコンフォントです。

Luxeritasにマテリアルアイコンが搭載されたので今回はマテリアルアイコンを使うための設定方法を紹介します。

スポンサーリンク

アイコンフォントの設定

場所[Luxeritas] chevron_right [カスタマイズ]chevron_right アイコンフォント

ここに文章WordPress管理画面から[Luxeritas]→[カスタマイズ]と進み、上のアイコンフォントタブをクリックします。

アイコンフォントの設定画面が開いたらアイコンフォントの設定をします。

マテリアルアイコンの設定

マテリアルアイコンには5つのタイプのアイコンがあります。Luxeritasのマテリアルアイコンの設定で使いたいタイプにチェックを入れると使えるようになります。

  • Outline(アウトライン)
  • Filled(反転)
  • Round(丸め)
  • Sharp(シャープ)
  • Two tone(ツートーン)
きらり

結耶。設定には4つしかないよ(^^;

結耶

ちゃんと見ないとだめでしょ!
1番上の選択肢にはMaterial Icons ( Outlined + Filled ) 」と書いてあるんだよ。
つまり、1番上にチェックを入れれば「Outline」と「Filled」の2つが使えるんだよ。

マテリアルアイコンの設定はこれで終わりです。設定したら変更を保存をクリックして保存してください。

アイコンの使い方

マテリアルアイコンのタイプや使い方は以下の記事をご覧下さい。

マテリアルアイコンとFont Awesome

アイコンフォントの設定画面を見るとFont Awesomeの設定もあります。

Luxeritasにマテリアルアイコンが標準搭載された理由は「サイトをより高速化させるため」です。

きらり

Font Awesomeが有料化の方向に進んでるからじゃないの?

結耶

あはは。私も最初はそう思ったけど、開発者さんのサイトを見ると「高速化」のためだって!w

マテリアルアイコンはFont Awesomeより軽量なのでFont Awesomeからマテリアルアイコンに乗り換えればサイトの表示が早くなります。(速くするためには設定でFont Awesomeのチェックを外してください。)

ですが、マテリアルアイコンに乗り換えをすると表示されなくなるアイコンがあります。

きらり

あっ!そっか~。¥ボクも結耶も今まで記事の中とかでFont Awesomeのアイコン使ってるもん笑どれが表示されなくなるってことだよね!

結耶

その通り!マテリアルアイコンに乗り換えるにはFont Awesomeのアイコンを変更しなきゃいけない。
それは大変な作業だから私はしばらく併用だよ(^^;

マテリアルアイコンはサイトの高速化のためにバージョン3.18.0から実装されました。しかし、今まで記事などにHTMLやCSSでFont Awesomeを使っている人は多いと思います。

マテリアルアイコンのみ使うか、今まで通りFont Awesomeのみ使うか、両方使うかは「アイコンフォントの設定」で選択できるのでそれぞれのサイトの事情に合わせて設定してください。

結耶

テーマで使われているアイコンはマテリアルアイコンのみにシても表示されるようになっているので、Font Awesomeは使って居ない方はマテリアルアイコンのみにしても問題ないと思います。

以上です。

応援よろしくお願いします。
      ブログランキング・にほんブログ村へ

お問い合わせはこちら
この記事を書いた人
結耶(ゆうや)

2017年9月からブログを始め、2018年1月にWordPressに変更しました。知識ゼロのから始めた超初心者で、WordPressやHTML、CSSなど勉強したことを書いています。
愛知県在住。多発性硬化症(MS)という難病と闘っています。

登場キャラクター
きらり
きらり

ある日ひょっこり現れ住みついた居候(いそうろう)。今は結耶と一緒にWordPressやアフィリエイトのことを勉強している。
性別は♂ 。どこから来たかは不明。

楽天ROOM