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

WordPressにはカスタムメニューという機能があり、管理画面で設定したリンクをテーマに表示させられます。
このリンクの設定で、サイト内リンクにも関わらず、「カスタムリンク」という固定のURLでリンクが設定されていることがよくあります。
カスタムリンクは外部サイトへのリンクのみで、内部リンクには貼らないようにしましょう。
なぜカスタムリンクを使ってはいけないのか?
「カスタムリンク」には「http」「https」から始まる固定のURLを設定することになるので、ドメインが変わってもそのまま変更されることなく、設定したURLが残ってしまいます。

開発環境と本番環境とでわざわざ設定し直さないといけなくなったり、ローカル開発環境のページを見ているつもりが、リンクをクリックして気づかないうちに本番環境のページを見ていたなんてことにもなりかねないので、URLを固定で書くことはやめましょう。
リンクの設定方法
固定ページなどは普通に設定されていることが多いのですが、カスタムリンクで設定されているのが多いのが下記のような、「よく使うもの」の選択肢に出てこない項目です。
- 「ホーム」や「プライバシーポリシー」などの普通の固定ページと扱いが違うページ
- 「カテゴリー」の親要素
- 「カスタム投稿タイプ」の「一覧画面」
これらのページは、メニュー項目の「すべて表示」をクリックすると、表示されるのでそこから選択すればOKです。

意外と知らない人が多く、これらの項目をカスタムリンクで直接URL指定しているのをよく見かけるので、WordPressの機能で解決できる部分はうまく利用するようにしましょう。
カスタムリンクを使うパターン
というわけで、カスタムリンクを使うパターンは下記2つに絞られます。
- 外部サイトへのリンク(本番環境と開発環境でリンク先が変わらない)
- ページ遷移ではなく、モーダルを表示させるためのボタンなど
外部サイトのリンクは直接書く必要があります。
ページ遷移ではない、モーダルを表示させるためのボタンをメニューに追加したい場合は、カスタムリンクで「#」を指定してあげます。
ちなみに、管理画面右上の[表示オプション]で「CSS クラス」にチェックを入れると、メニュー項目にclassを設定できるようになります。
![[表示オプション]から「CSS クラス」の表示](https://webrandum.net/mskz/wp-content/uploads/2020/11/image_3-1-1024x274.png)
これでモーダル用のボタンにclassを設定してあげるとスマートな作りにできます。

Visual Studio Codeでショートカットキーを変更する方法
Visual Studio Codeで複数ファイルを編集するときにタブやペインの操作方法
Nuxt.jsの基本と最初のセットアップ「プロジェクトの作成と起動をするまでの流れ」
Google Maps APIでピンをクリックしたときに吹き出しを表示する方法
gulpでPostCSSを使う方法
PubSubHubbubを利用してWebサイトの更新をリアルタイムに通知しよう
SourceTreeでBacklogのGitを使うときに、権限エラーになってしまう場合の解決法
コーディングで「スペース」と「タブ」のどちらを使えばいいのか?
iOS Safariで指定したフォントサイズにならない場合の対処法
iTerm2で「Use System Window Restoration Setting」を設定しているとアラートが表示されて機能しない
Google Chromeのサイト内検索(カスタム検索)機能を別のプロファイルに移行する方法
iPadで入力モードを切り替えずに数字や記号をすばやく入力する方法
iPhoneやiPadでYouTubeの再生速度を3倍速や4倍速にする方法
Keynoteで有効にしているはずのフォントが表示されない現象
MacのKeynoteにハイライトされた状態でコードを貼り付ける方法
AirPodsで片耳を外しても再生が止まらないようにする方法
iTerm2でマウスやトラックパッドの操作を設定できる環境設定の「Pointer」タブ
DeepLで「インターネット接続に問題があります」と表示されて翻訳できないときに確認すること
Ulyssesの「第2のエディタ」表示を使って2つのシートを横並びに表示する
操作に没頭できる!Firefox版 Arcのようなブラウザ「Zen Browser」
chezmoi(シェモア)で始めるdotfiles管理
GitHubの通知を見逃さない!通知に特化したアプリ「Gitify」
Keyboard Maestroの変数基礎
Neovimを使い始める最初の一歩として便利な「LazyVim」
ウェブサイトをmacOSアプリとしてラッピングする「Unite Pro」
Keyboard Maestroの「Macro Debugger」で複雑なマクロのデバッグを行う方法
無料版でも高機能なランチャーアプリ「Raycast」の基本機能と環境設定
OnyXでターミナルを使わずにmacOSの詳細設定を行う
軽量で高速なターミナルエミュレーター「Ghostty」の設定方法