WordPressでページごとに異なるナビゲーションメニュー項目を表示したいですか？それともログイン中のユーザーには別のメニューを表示しますか？
WordPressでは、テーマの特定の場所にナビゲーションメニューを表示することができますが、初期設定では常に同じメニューが表示されます。
この投稿では、WordPressでメニューに条件ロジックを追加する方法を紹介する。
なぜWordPressのメニューに条件ロジックを追加するのか？
ナビゲーションメニューはWordPressサイトに構造を与え、訪問者が探しているものを見つけやすくします。初期設定では、WordPressサイトはすべてのユーザー、すべての投稿とページに同じナビゲーションメニューを表示します。
しかし、ユーザーやサイト内のページによって異なるメニューを表示したい場合もあるでしょう。
オンラインショップ、WordPressの会員制サイトコミュニティ、オンライン学習プラットフォームなどのサイトは、すべてパーソナライズされたナビゲーションメニューの恩恵を受けることができます。
条件付きロジックを使えば、ログイン中のユーザーに対して、アカウントの管理、購読の更新、購入したオンラインコースの表示などの追加メニュー項目を追加することができます。WordPressメニューのアクセスコントロールと考えることができます。
それでは、WordPressでメニューに条件ロジックを追加する方法を見ていきましょう。このチュートリアルで扱うトピックは以下の通りです：
- WordPressで新規ナビゲーションメニューを作成する
- WordPressでログイン中のユーザーに異なるメニューを表示する
- WordPressでユーザー権限グループによって異なるメニューを表示する
- WordPressでページごとに異なるメニューを表示する
- WordPressでランディングページのナビゲーションメニューを非表示にする
- WordPressのナビゲーションメニューをもっと活用する
WordPressで新規ナビゲーションメニューを作成する
最初のステップは、WordPressで表示したい追加ナビゲーション・メニューを作成することです。その後、条件ロジックを使って、各メニューを表示するタイミングを決めることができる。
WordPressダッシュボードの外観 ” メニューページにアクセスするだけです。すでにナビゲーションメニューがあり、すべてのユーザーにサイト上で使用している場合は、これを初期設定メニューにすることができます。
次に、「新規メニューを作成」リンクをクリックして、新しいメニューを作成する必要があります。例えば、ログイン中のユーザーに表示するメニューと、WordPressの特定のページやカテゴリーに表示するメニューを作成することができます。
画面の左側に、あなたのサイトのページ一覧が表示されます。メニューに追加したいページにチェックを入れ、「メニューに追加」ボタンをクリックしてください。
画面右側のメニュー項目をドラッグ＆ドロップして並べ替えることもできる。
さらにページを進むと、メニューを表示する場所を選ぶことができます。しかし、今はこのメニューに場所を割り当てる必要はありません。それは次のステップで行います。
メニューの保存」ボタンをクリックして変更を保存することを忘れないでください。
メニュー作成の詳細については、WordPressでナビゲーションメニューを追加する方法についての初心者向けガイドをご覧ください。
WordPressでログイン中のユーザーに別のメニューを表示する
ユーザーがサイトにログイン中か否かに応じて、異なるナビゲーションメニューを表示することはしばしば便利です。
例えば、ログアウト中のユーザーのためにログインや登録のリンクを入れたり、ログイン中のメニューにログアウトリンクを追加することができます。
また、WooCommerceストアを運営しているのであれば、一般には非表示になっている項目をカスタマイザーに含めることもできます。
まず、Conditional Menusプラグインをインストールして有効化する必要があります。詳しくはWordPressプラグインのインストール方法をご覧ください。
有効化したら、外観 ” メニューページにアクセスし、「ロケーションの管理」タブに切り替える必要があります。
ここから、利用可能なメニューの場所と現在表示されているメニューのリストが表示されます。これらは使用しているWordPressテーマによって異なります。
例えば、デモサイトでは、プライマリメニューの場所に「メインメニュー」というナビゲーションメニューが表示されています。
特定の条件に一致したときに別のメニューを表示するようにプラグインに指示するには、’+ Conditional Menu’リンクをクリックし、ドロップダウンメニューから別のメニューを選択します。このチュートリアルでは、’ログイン中メニュー’を選択します。
次に、「＋条件」のリンクをクリックする必要がある。
するとポップアップが表示され、たくさんの条件から選ぶことができる。
ユーザーログイン中」オプションの横にあるボックスにチェックを入れ、「保存」ボタンをクリックするだけです。
ログイン中のユーザーメニューが表示されます。あなたのサイトからログアウト中、他のすべてのユーザーに表示されるナビゲーションメニューを見ることができます。
さらに詳しく、コードを使った方法を知りたい方は、WordPressでログイン中のユーザーに異なるメニューを表示する方法をご覧ください。
ユーザー権限グループによって異なるWordPressメニューを表示する
ユーザーがログイン中、割り当てたユーザー権限グループによって異なるナビゲーションメニューを表示することもできます。
例えば、管理者には特別なメニュー項目を、寄稿者にはより限定された項目を含めることができます。また、会員制サイトでは、会員レベルごとに異なるアクセス権を与えることもできます。
前のセクションと同様に、Conditional Menusプラグインをインストールし有効化した後、外観 ” Menusページにアクセスし、’Manage Locations’タブに切り替える必要があります。
選択するユーザー権限グループに適切な条件メニューを追加する必要があります。このチュートリアルでは、’Nav Menu Administrator’メニューを選択します。
その後、ユーザー権限グループを選択できるように、「+ Conditions」リンクをクリックする必要があります。
サイトの各ユーザー権限グループのチェックボックスを表示するには、「ユーザー権限」タブをクリックする必要があります。このメニューが表示されるユーザー権限グループをクリックし、「保存」ボタンをクリックしてください。
WordPressでページごとに異なるメニューを表示する
WordPressでは、ページごとに異なるメニューを表示することができます。例えば、プライバシーポリシーページに Cookie通知へのリンクのような特別なメニュー項目を表示することができます。
これを行うには、上記のようにConditional Menusプラグインをインストールして有効化し、適切なナビゲーションメニューを選択して「+ Conditions」リンクをクリックする必要があります。
今回は「ページ」タブをクリックしてください。あなたのサイトのすべてのページのリストが表示されます。
ナビゲーションメニューを表示したい各ページの横にチェックマークを入れ、「保存」ボタンをクリックします。
WordPressでランディングページのナビゲーションメニューを非表示にする
ランディングページなど、ナビゲーションメニューをすべて表示したくないページもあるでしょう。
ランディングページは、ビジネスの売上を伸ばしたり、リードを生み出したりするためにデザインされます。このようなページでは、気を散らすものを最小限に抑え、ユーザーが特定の行動を起こすために必要な情報をすべて提供したいと思うでしょう。
ランディングページのコンバージョンを300％増加させる方法のガイドでは、ナビゲーションメニューやその他のリンクをページから削除することで、気が散るのを最小限に抑えることができると提案しています。
そのためにはConditional Menusプラグインを使います。条件付きメニューを選択するとき、今度はドロップダウンメニューから「メニューの無効化」を選択する必要があります。
次に、「＋条件」リンクをクリックして、メニューを表示するタイミングを選択する必要がある。
ページ」タブをクリックし、ランディングページの横にチェックマークを付けてください。
保存』ボタンをクリックして設定を保存するのをお忘れなく。
WordPressのナビゲーションメニューをもっと活用しよう
ナビゲーションメニューは強力なウェブデザインツールです。ユーザーをサイトの最も重要なセクションに誘導することができます。
ページやユーザーごとに異なるナビゲーションメニューが表示されるようになった今、さらにカスタマイズするにはどうしたらいいか悩んでいる人も多いだろう。
WordPressサイトのナビゲーションメニューの機能を拡張する便利なチュートリアルをお試しください。
- WordPressの特定のメニューにカスタム項目を追加する方法
- WordPressテーマでカスタムナビゲーションメニューを追加する方法
- WordPressでフルスクリーンのレスポンシブメニューを追加する方法
- WordPressで縦型ナビゲーションメニューを作成する方法
- WordPressサイトにメガメニューを追加する方法
- WordPressナビゲーションメニューのスタイル設定方法
このチュートリアルでWordPressのメニューに条件ロジックを追加する方法を学んでいただけたでしょうか。また、自動化されたワークフローを作成する方法や、WordPressとWooCommerceに最適なソーシャルプルーフプラグインのリストもご覧ください。
If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.
Syed Balkhi says
Hey WPBeginner readers,
Did you know you can win exciting prizes by commenting on WPBeginner?
Every month, our top blog commenters will win HUGE rewards, including premium WordPress plugin licenses and cash prizes.
You can get more details about the contest from here.
Start sharing your thoughts below to stand a chance to win!
Bet Hannon says
Be VERY careful with making menus different across your site. It’s not a problem to show different menus to logged in/out users, but to meet WCAG 2.0+ accessibility standards, main menus should be consistent page to page.
WPBeginner Support says
Thank you for sharing that for those attempting to have those standards for their site.
管理者
Kevin says
I don’t see the “Enable conditional logic” under Appearance -> Menu. I’m using WordPress 5.7 as of March 16, 2021.
WPBeginner Support says
The wording may have changed since this article but there should still be a checkbox for changing the visibility.
管理者
Laurentiu says
A small feature, but very missed when a programmer is asked to work in wordpress.
WPBeginner Support says
Glad you found this recommendation helpful
管理者
Richard Spatts says
Thanks for this, it really helped
WPBeginner Support says
You’re welcome, glad our guide helped
管理者
Richard S. says
BIG Thank you for this article, it’s awesome.
Your snippet of code was perfect for a project I was working on, as was this plugin which I’m now using.
Even in 2019 this is a handy page, it’s working well on WordPress 5.2.3 (Astra Pro theme) so still very applicable.
WPBeginner Support says
You’re welcome, glad our recommendation is helpful
管理者
Vasim Shaikh says
I would like to ask I have added role for user Author and subscriber both then its should be display to author not subscriber. how to handle this?
WPBeginner Support says
You could set it to show if the user is the role of Author
管理者
Rudolf says
Really simple and easy to use plugin. Fantastic! It did not only save me a lot of time but also an organizational advantage because instead of using widget logic with different menu widgets, I create now one 1 menu with conditions per item.
Jonathan P says
Thank you,
I have only used this plugin for conditions for users that are logged in or not logged in, but it works great, it really has saved me hours of messing around with code.
Kiva says
Could I set up this plugin so that I can set up different menu options for each different category?
Sphelele says
There is no conditional logic feature on my menu.
David says
Thank you guys for sharing this. However it will display a PHP Notice on conditioned menu items and the custom condition won’t be displayed among condition options, if you don’t specify the id parameter.
Paul says
Hi, I added conditions (if a string matches the server name, a menu is hidden). Great! But I would like to add even more custom conditions. Could you show an example of the code you would use to add more than on name/condition pair the custom option?
name = “If the site is not www.”
condition = www is not in SERVER_NAME
name = “Paul site.”
condition = “paul is in SERVER_NAME”
etc.
Thanks!
Isuru says
This Conflicts the WP User Manager Pro, and then user manager Pro plugin functions not working due to the confliction.
as an ex: Show password tick in user registration page doesn’t work, as well as login page also not functioning well.
can you please fix this
Mo says
Yep, definitely broken.
Works great for the built in conditions, but when coding custom conditions it works once and then stops working.
jban says
YES!!! After 90 minutes of trying to figure this out, this article made it work for me. THANK YOU!!!
Jesus Flores says
Works great!!! Thank you
Mohi says
Hello
I installed this plugin, but I am getting an warning as follows :
Warning: Missing argument 2 for custom_nav_edit_walker() in /var/www/equest/wp-content/themes/wp-questrian/framework/megamenu/mega-menu.php on line 42
How to solve this warning ? Please guide me.
WPBeginner Support says
Seems like the plugin is not compatible with your theme’s mega menu functionality. Please contact your theme’s support.
管理者
JMD says
I have not used the If Menu plugn, but I tried the Nav Menu Roles plugin
It works but then conflicts with the Mega menu functionality of my theme.
I am hesitant to try the If Menu plugin mainly because it has not been updated in so long. It will be a matter of time before I have to remove it for sure.
Peter says
Could not get this plugin to work. Not showing up i menu-items. Using: WP 4.3 / Nimwa theme.
Any suggestions on similar working plugin? Just want to hide some menu items while working on them…
Shafiq says
Seems to work ok under WP 4.3.
Chuks Eke says
Hi,
Could this be achieved with this plugin,
I want to have different menu for different pages or post. for example,
Home | About Us | Service | Contact
About Us [ History | Team | Career ]
Services [ Web Development | Window Application | Corporate ID ]
Is it possible with this plugin to show sub menu on side menu for About Us
Mike J says
I found this plugin does not work with some themes
WPBeginner Support says
Please report the themes to plugin using the support tab on the plugin page. May be they can help you with this.
管理者
Dieter says
Seems to be broken under WP 4.2.2.
WPBeginner Support says
What seems to be the problem? Working fine at our end.
管理者
Dieter says
I stopped installation after reading WP Org PlugIn Page, there is the comment “1 person says it is broken” and in the support section is an open report which is not solved.
If I read something like this I don’t even try to install such plug in.
Jagabandhu says
The plugin is not working. It’s not showing “enable conditional logic” and the plugin author is not responding from last 7 months.
Tried with disabling other plugins. But no result.
Is there any other plugin to do so!?
I need it.
WPBeginner Support says
We just tested the plugin and it is working fine at our demo site. Can you test it by switching to a default theme with no other plugins activated?