メニューに画像を表示する【Menu Image, Icons made easy】の使い方

テキストだけのメニューでは、ちょっと味気ないし、ぱっと見でどんなメニューなのかが分かりづらい。
『Font Awesome』を使用してアイコンフォントを表示するという手もありますが、自分の好きな画像を使いたいというときもあるでしょう。

Menu Image, Icons made easy】は、メニュー項目に画像を表示することができるプラグイン。

マウスオーバーで画像を切り替えて表示することもできます。

こんな場合におススメ

  • メニューに画像を表示したい

プラグインを使ってできること

  • メニュー項目に画像を表示することができる
スポンサーリンク

使用イメージ

Menu Image, Icons made easy 使用イメージ

インストール

Menu Image, Icons made easy インストール
[list class=”ol-circle li-accentbdr acc-bc-before”]

  1. 管理画面から プラグイン > 新規追加 とクリックする
  2. Menu Image, Icons made easy“で検索する
  3. “今すぐインストール”をクリック。インストール後、有効化する
[/list]

または、配布サイトからダウンロードして、インストール。
Menu Image, Icons made easy – WordPress プラグイン | WordPress.org

手動でインストールする方法はコチラ
[kanren id=”1001″ target=”_blank”]

使用方法

管理画面 > 外観 > メニュー をクリックし、メニュー画面を開きます。
画像を表示させたいメニュー項目を選択します。
Menu Image, Icons made easy 使用方法
[timeline][tl label=’STEP.1′ title=’画像を選択’]メニュー画像・マウスオーバー時の画像を、メディアライブラリから選択します[/tl][tl label=’STEP.2′ title=’画像サイズの選択’]表示するメニュー画像のサイズを選択します[/tl][tl label=’STEP.3′ title=’タイトルの位置を選択’]ナビゲーションラベルを表示する位置を選択します[/tl][/timeline]

設定

プラグインを有効化すると、管理画面に【Menu Image】項目がされるので、そこから設定を行います。
Menu Image, Icons made easy 設定

Menu image Hoverマウスオーバー時の画像を使用できるようにするかの選択
1st Menu Image size1つ目の画像サイズを指定
2nd Menu Image size2つ目の画像サイズを指定
3rd Menu Image size3つ目の画像サイズを指定

動作確認環境

  • バージョン 2.9.5
  • WordPress 5.2.3
このプラグインは上記の環境で動作を確認しましたが、ご使用の環境によっては、動作しないなどの不具合が起きる可能性がありますので、ご注意ください。

まとめ

  • Menu Image, Icons made easy】は、メニューに画像を追加表示するプラグイン
  • テキストだけのメニューよりも画像が表示されていた方が、視覚的に分かりやすくなります。
メニューに画像を表示する【Menu Image, Icons made easy】の使い方
最新情報をチェックしよう!
スポンサーリンク