ユーザーから、リンクを追加せずにWordPressメニューにタイトルを追加する方法があるか、よく尋ねられます。
長年にわたり、私たちは何千ものユーザーがWordPressを使い始めるのを支援してきました。新しいウェブサイトを開始するときにメニューを設定することは、最も重要なことの1つです。
ただし、ドロップダウンメニューを作成する際に、特定のページにリンクせずにサブメニューのタイトルを追加したい場合があります。これにより、訪問者は同じページに留まります。
この記事では、ページにリンクせずにWordPressメニューにタイトルを追加する方法を紹介します。
ページにリンクせずにメニュータイトルを追加する理由
WordPressは、ウェブサイトをカスタマイズするための複数のオプションを提供しており、ターゲットオーディエンスにリーチし、優れたユーザーエクスペリエンスを提供することができます。
スムーズなユーザーエクスペリエンスを提供するために、WordPressウェブサイトには構造化されたナビゲーションメニューが必要です。これにより、ユーザーはサイト上のコンテンツやさまざまなページを簡単に見つけることができます。
メニュータイトルを追加すると、デフォルトでWordPressは各メニューにページまたはカスタムリンクへのリンクを要求します。ただし、特定の状況下ではメニュータイトルを表示したいが、ページにリンクさせたくない場合があります。
例えば、メニューのタイトルテキストを「カテゴリー」としたいが、リンクは不要な場合に、カテゴリーのドロップダウンを作成できます。ユーザーがカテゴリーをクリックすると、ドロップダウンでサブメニューが開くだけです。
それを踏まえた上で、ページにリンクせずにWordPressメニューにタイトルを追加する方法を見ていきましょう。
ページにリンクせずにWordPressメニュータイトルを追加する
まず最初に行う必要があるのは、メニューに新しいメニュー項目を追加することです。これは、WordPress管理パネルから外観 » メニューに移動することで実行できます。
注意: 外観 » メニューオプションが表示されない場合は、ブロックテーマを使用しており、このチュートリアルはテーマでは機能しません。
次に、カスタムリンクを追加します。「メニュー項目を追加」セクションに「カスタムリンク」オプションが表示されます。
カスタムリンクが表示されない場合は、画面右上にある「表示オプション」ボタンをクリックしてください。次に、「カスタムリンク」のチェックボックスをオンにします。
その後、メニュー項目のラベルまたはタイトルを入力する必要があります。
URLフィールドにハッシュ記号（#）を入力し、「メニューに追加」ボタンをクリックしてください。
メニュー項目がWordPressメニューに追加されました。
次に、このカスタムリンクの横にあるドロップダウン矢印をクリックして、メニュー項目を編集します。URLフィールドのハッシュタグ記号を削除し、「メニューを保存」ボタンをクリックしてください。
このメニュー項目にサブメニューを追加し、任意のページにリンクしたり、カスタムリンクを入力したりできます。
メニューをサイトに追加する方法についてヘルプが必要な場合は、WordPressでナビゲーションメニューを追加する方法に関するガイドをご覧ください。
さて、あなたのWordPressブログにアクセスすると、リンクのないメニュー項目が表示されます。
この記事が、ページにリンクせずにWordPressメニューにタイトルを追加する方法を学ぶのに役立ったことを願っています。また、WordPressメニューにソーシャルアイコンを追加する方法やWordPressメニューに検索バーを追加する方法に関するガイドも参照してください。
この記事が気に入ったら、WordPressのビデオチュートリアルについては、YouTubeチャンネルを購読してください。 TwitterやFacebookでもフォローできます。
Marit
ありがとうございます！まさに必要としていた情報でした！
ケン
まさに私が求めていたものです。
どうすればできるのか頭を悩ませていました。
そんな時にこの記事に出会い、本当にありがとうございました。
Jon
これは素晴らしく機能しました、ありがとう！
Petur Kirke
この記事で一点だけ抜けていることがあります。
ハンド（cursor: pointer）をなくす方法、またはこの問題を抱えているのは私だけですか？
Scot
プライマリメニューのトップレベルでこの種のカスタムリンクを使用しており、デスクトップではうまく機能します。しかし、モバイルデバイスでは、カスタムリンクをタップしても、その下のサブメニューが開かず、それらのページにアクセスできません。これを修正する方法はありますか？
adnan
これは役に立ちました、ありがとう
Hamba Allah
本当にありがとうございます :*
ルイス・カサノバ
ありがとうございます！
まさに必要としていたものです！
Steve
あなたが提案したように、私はウェブサイトのメニューに#メソッドを使用してタイトルを追加しましたが、それを削除する必要がありました。ダッシュボードで削除しましたが、サイトのメインメニューにまだ表示されており、開くと「空白のページ」と表示され、安全ではないと言われます。どうすれば削除できますか？
WPBeginnerサポート
キャッシュプラグインを使用している場合は、キャッシュファイルを削除してください。また、メニュー画面にアクセスして、メニュー項目を削除したことを確認してください。メニュー項目を追加または削除した後、メニュー項目の保存をクリックすることを忘れないでください。これで役立つことを願っています。
管理者
Pam Hill
ページリンクを削除する必要がある既存のメニューがあります。どうすればよいですか？ヘッダーに3つのタイトルがあり、それぞれ自身のページにリンクしています。どのページにもリンクさせたくありません。
Danielle
OMG、これは本当に助かりました。もっと早く見つけられればよかったです…。ずっとこれを理解しようとしていました。本当にありがとうございます!!
ブレンダン・ダン
この方法で問題を解決しました。素晴らしいです、ありがとうございます。
しかし、作成されたメニューヘッダーはページではないので、サブページをマッピングするとき、どのように構造化すればよいですか？
Marek
Hello,
ラベルとして機能させたいカスタムメニュー項目を作成しましたが、その項目からURLを削除しましたが、リンクのようにマウスオーバー時に異なる色で表示されます。その項目からホバー効果を無効にするにはどうすればよいですか？
ここで見ることができます。項目は、ロゴの下のメニューにある「Written About Braunstein’s:」です。
ありがとう
Susan Taunton
これは、リンクされていないメニュータイトルのホバー効果を削除する方法についてのMarekの8月9日の質問への返信です。
Marek,
ブラウザの開発ツールを使用して、そのタイトルのメニュー項目番号を特定し、CSSを使用してリンク、訪問済み、ホバー、フォーカス、アクティブの色をすべて同じに定義することで、ホバー効果を削除できます。
例：
#menu-item-2036 a,
#menu-item-2036 a:link,
#menu-item-2036 a:visited,
#menu-item-2036 a:hover,
#menu-item-2036 a:focus,
#menu-item-2036 a:active {
color:#C1A45B;
}
Susan
Huzni Saud
素晴らしい仕事、仲間
Penelope Whiteley
これが理解できませんでした…完成した製品を示す他の画像はありますか？
Norbert
ありがとう、素晴らしいし、うまくいきました!!!!
WILLIAM
ありがとうございます、見事に機能しました。
Rui
外観>メニューを使用して、URLを次とするカスタムリンク項目を作成します
javascript: void(0);
This is the a great way of solving that problem
Peter
これはしばらく悩みの種でしたが、何もしていませんでした。Googleで検索したらビンゴ、解決しました。とても簡単です、ありがとう。
アネリーズ・ミラー
完璧に機能しました！とても分かりやすかったです！ありがとうございます！
teri matelson
カスタムリンクを作成して、プライマリナビゲーションに追加し、新しいウィンドウで開くことはできますか？
マティアス
ありがとう – とても参考になりました！
Rajit
こんにちは、カスタムリンクのスタイルを変更するにはどうすればよいですか？クリックできない見出しで2つのメニュー項目のセットを分離したいのですが。
ありがとう
Graham
Cheers for that. We were really stuck. Knew it could be done, but didn’t know how…until now. Yer a star
Rosie
ありがとうございます!!まさに私がやりたかったことで、うまくいきました。
Rosie
サンジェイ・ナイル
とても簡単！まさに必要としていたものです。ありがとうございます。
ヘイリー
ありがとうございます！まさに私が求めていたものです！
キャロル・M・スミス
ありがとう…でもメニューに「メニュー項目」という言葉を入れたくありません…「メニュー項目」の名前を変更できますか？
Leanne
まさに知りたかったことです！ありがとうございます!!
Bob Varaleau
これを行うためにカテゴリを使用していましたが、これははるかに優れています。あなたが私を助けることができるかもしれない一つの問題があります。
カスタムリンクをクリックした場合、サブアイテムやページ上の他の場所をクリックするまで、カスタムメニューリンクはハイライトされたままになります。些細なことですが、修正できればメニューの修正はさらに良くなります。CSSでこのカスタムリンクメニューボタンをクリック不可にすることは可能ですか？
Menno van der Krift
ありがとう！うまくいきました。
マイク
奇妙なことに、これはiPadでは機能しません。サブメニューが表示される前に、画像を保存するかどうか尋ねられますか？ドロップダウンボタンに通常のページリンク、つまり「ページ」から取得したメニュー項目がある場合は、うまく機能します。
ジョージ
これは素晴らしいです – うまくいきました。しかし、ドロップダウンメニューのタイトルが白から青に変わってしまいました。WordPressでこれを修正する方法を誰か説明してもらえませんか？
jhodgski
これについてはありがとうございます。しかし、アンカー/リンク要素がhref属性を持たないまま終わるため、無効なHTMLになるのではないでしょうか。また、項目が実際にはリンクでない場合にアンカー/リンク要素を使用するのは意味的にも正しくありません。他に良い方法はありますか？
viktoriana
これは私のケースではうまくいきませんでした:/ メニューを「変換」しましたが、それはリンクのulリストを登録済みのwp_nav_menuに変換したもので、現在、wp_list_categoriesとしてリストされていたカテゴリは、以前のようにカスタムリンクの下に表示されません。何らかの方法でwp_list_categoriesをwp_nav_menuに追加する必要があり、この投稿が示唆するように簡単ではありません。:/
viktoriana
except this is not working
followed exactly what you’ve written, added two categories us subpages, but submenu is not showing.
there must be some wp_list_categories thingy messing up my wp_nav_menu …
bb
wpbeginnerが大好きです！この調整、ありがとう、乾杯
Rob Lowndes
まさに探していたものです。しかし、新しい空のメニュー項目としていくつかのページをサブ項目として配置すると、メニューを保存するまでは見栄えが良いのですが、保存するとそれらのページは自動的にメインメニューに戻ってしまいます！つまり、WP 3.7.1では新しい項目にサブメニューを保存できません。誰か助けてもらえませんか？
ウェイン・ジェラルド
私はこのことを私の広範なトレーニングウェブサイトで行いました。しかし、カスタムリンクを使い果たしてしまい、WordPressのカスタムリンクの上限に達しました。この上限を超えると、ナビゲーションメニューは保存されなくなります。では、このカスタムリンクの上限を回避するにはどうすればよいですか？プラグインはありますか？もしあれば、見つけられません。
どんな助けでも、大変、大変感謝します。
Joe Dean
もう解決済みかもしれませんが、他に読んでいる方のために：
https://www.wpbeginner.com/wp-tutorials/how-to-fix-the-custom-menu-items-limit-in-wordpress/
kuldip
ありがとう、それは私にとって役立ちます
ムフリス
これは私がウェブサイトresellerhunter.comのカテゴリドロップダウンメニューを編集するために探していたものです。助けてくれてありがとう。
grrprep
逆のことをしたいのですが。メニューに表示させたくないページを追加したいのです。約20ページあり、メニューに20個のサブリンクを表示させたくありません。助けていただけると幸いです。
CHRIS
メニューに移動し、「新しいトップレベルページを自動的に追加」のチェックを外します。これで、任意のページをメニューに表示するには、自分で追加する必要があります。
ジャネット
ありがとうございます！ずっとやり方を知りたかったんです。:)
Jake Tyler
本当に素晴らしいチュートリアルです、どうもありがとうございます。
Chris
リンクのないメニュー項目にマウスを合わせたときに、マウスカーソルが変わらないようにする方法はありますか？ブラウザがリンクとして認識しないようにするにはどうすればよいですか？
ありがとう。
マイク・オット
CSSで要素を次のようにターゲットにすることができます:
cursor:crosshair;
バック
ナイスチュート、これが可能だとは知りませんでした。
ベス・ピットマン
この投稿をありがとうございます！私だけでしょうか？メニュー画面のドロップダウン矢印を開くのに苦労している人は他にいますか？矢印をクリックすると、メニュー項目がメニュー内で下に移動するだけです。最終的に開くまで、何度も繰り返す必要があります。何かヒントはありますか？
Lorne
既存のメニューがあるWP v3のウェブサイトで、同じことをどのように達成（変更）できますか？
ありがとう
SmittenbyBritain
ヒントをありがとう。どうすればいいか考えていました。URLがない場合は、単にホームにリンクを戻していました。これは素晴らしいですね！
bob
すでに大きなメニューバーを設定している場合はどうなりますか？後で最初のメニューバーのタイトルを変更して、ページにリンクしないようにすることはできますか？
編集スタッフ
はい、メニューはいつでも調整できます。このテクニックは、長いメニューバーにドロップダウン項目を追加したい場合に特に役立ちます。
管理者