【Lion Media】メニューのカテゴリーにアイコンを表示させる方法

how-to-show-icon-with-category

[adchord]

どーも、本ブログを必死に運営してるむくちくん(@whoismukuchikun)です!

今回は、僕がこだわった、「メニューのカテゴリーにアイコンを表示させる方法」をご紹介します!
どういうことかというとこういうことです↓↓↓

menu-customized

もともとはこんな感じでした↓↓↓
menu-default

他の人のブログを見てもカテゴリーには何かしらのアイコンが付いていて、
そのカテゴリ―をイメージしやすくなっています。

ですが僕が使っているLion MediaというWordPressテーマでは、
そんな機能はなく、寂しく文字だけが出る仕様でした。

しかしいろいろ調べてやってみると案外簡単にカスタマイズできたので、
その方法をご紹介したいと思います。
 
 

①まずFont Awesomeを入れましょう

Font Awesomeとはアイコンを文字と同様にブログの中に組み込める?やつです!
とりあえずBootstrapみたいなものかなと思っています。(?)
それを自身のブログで使えるようにしましょう。
以下の記事が分かりやすいです。

Font Awesomeを使おう・Webアイコンの使い方【CSS】


Font Awesomeが実際入っているか(コードが反映されるか)確かめましょう。
←これFont Awesomeで虫を出してます。

②メニューをFont Awesomeで編集

how-to-paste-code-in-menu

↑図のようにWordPressの設定にて、

「外観」→「メニュー」に行き、メニュー構造が見える画面に行きます。

そこのナビゲーションラベルという所に好きなアイコンのコードを貼り付けましょう。

以上です!

まとめ

たったの2ステップでメニューのカテゴリーにアイコンを付けることができます!

これでブログのアクセス数も上がるかも!!

では今日はこの辺で。
[adchord]

コメントを残す

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