Simplicity2においてプラグインのMax Mega Menuを用いてグローバルナビを作成している際に,各メニュー項目の前にアイコン(絵文字)を導入する方法を説明します.スタイルシートなどをいじる必要は無く,WordPressの管理画面から変更することが可能です.
メニュー項目にアイコンを導入する方法
本記事ではMax Mega Menuというプラグインを使用してグローバルナビを作成していることを前提としております.
Simplicity2のオリジナルのグローバルナビよりも使いやすく,特にレスポンシブ性とスマホでの可視性に優れているので,使用することをお勧めします.
詳細は過去の記事をご覧ください.
アイコンを導入する方法を説明します.
①WordPressの管理画面から「外観→メニュー」を選択します.
②メニュー画面の右側に各項目があります.その項目名の少し右あたりにマウスを持っていくと,「Mega Menu」というアイコンが表示されるので,それをクリックします.
③設定画面になるので,左部から一番下のIconを選択します.
④導入したいアイコンを選択します.するとsavingと表示が出ます.表示が消えたら右上の×から選択画面を閉じます.なお,ここでタブでFontAwesomeなども選択することができますが,無料版のMax Mega Menuでは使用することができません.
⑤元のメニュー画面に戻ったら,画面右上の「メニューを保存」をクリックして設定を反映させます.
⑥以上により,下図のようにメニュー項目の前にアイコンを導入することができました.
通常Simplicity2の場合,FontAwesomeのアイコンを簡単に導入することができるのですが,無料版のMax Mega Menuを使用していると使えないようでした.
無料版で選択できるアイコンは限られているのですが,それなりの数はあるので何か良いものがないか探してみると良いと思います.