# WordPressのカスタムメニューでは、内部リンクに対してカスタムリンクは使わない！

URL: https://webrandum.net/wordpress-custom-menu-custom-link/
公開日: 2020-11-04
更新日: 2020-11-04
カテゴリー: コーディング
タグ: WordPress
出典: Webrandum（著者: サイトウ マサカズ）

WordPressにはカスタムメニューという機能があり、管理画面で設定したリンクをテーマに表示させられます。

このリンクの設定で、サイト内リンクにも関わらず、「カスタムリンク」という固定のURLでリンクが設定されていることがよくあります。

カスタムリンクは外部サイトへのリンクのみで、内部リンクには貼らないようにしましょう。

## なぜカスタムリンクを使ってはいけないのか？

「カスタムリンク」には「http」「https」から始まる固定のURLを設定することになるので、ドメインが変わってもそのまま変更されることなく、設定したURLが残ってしまいます。

![カスタムリンクの設定](https://webrandum.net/mskz/wp-content/uploads/2020/11/image_1-1-1024x451.png)

開発環境と本番環境とでわざわざ設定し直さないといけなくなったり、ローカル開発環境のページを見ているつもりが、リンクをクリックして気づかないうちに本番環境のページを見ていたなんてことにもなりかねないので、URLを固定で書くことはやめましょう。

## リンクの設定方法

固定ページなどは普通に設定されていることが多いのですが、カスタムリンクで設定されているのが多いのが下記のような、「よく使うもの」の選択肢に出てこない項目です。

- 「ホーム」や「プライバシーポリシー」などの普通の固定ページと扱いが違うページ

- 「カテゴリー」の親要素

- 「カスタム投稿タイプ」の「一覧画面」

これらのページは、メニュー項目の「すべて表示」をクリックすると、表示されるのでそこから選択すればOKです。

![カテゴリーで「すべて表示」から選択](https://webrandum.net/mskz/wp-content/uploads/2020/11/image_2-1-1024x451.png)

意外と知らない人が多く、これらの項目をカスタムリンクで直接URL指定しているのをよく見かけるので、WordPressの機能で解決できる部分はうまく利用するようにしましょう。

### カスタムリンクを使うパターン

というわけで、カスタムリンクを使うパターンは下記2つに絞られます。

- 外部サイトへのリンク（本番環境と開発環境でリンク先が変わらない）

- ページ遷移ではなく、モーダルを表示させるためのボタンなど

外部サイトのリンクは直接書く必要があります。

ページ遷移ではない、モーダルを表示させるためのボタンをメニューに追加したい場合は、カスタムリンクで「#」を指定してあげます。

ちなみに、管理画面右上の［表示オプション］で「CSS クラス」にチェックを入れると、メニュー項目にclassを設定できるようになります。

![［表示オプション］から「CSS クラス」の表示](https://webrandum.net/mskz/wp-content/uploads/2020/11/image_3-1-1024x274.png)

これでモーダル用のボタンにclassを設定してあげるとスマートな作りにできます。