WordPress|メニューのカスタムリンクとは【使い方と編集】

2021-02-06

WordPress|メニューのカスタムリンクとは【使い方と編集】

おのです。

WordPressで、メニューのカスタムリンクについてです。

WordPressでブログやサイトを運営している人の中には、カスタムリンクとは何か知りたい人も多いと思います。

また、使い方や編集についても知りたいところです。

 

そこで本記事では、カスタムリンクとは何か、使い方や編集について書きました。

メニューを使いこなしたい人は、参考にしてください。

 


スポンサーリンク


WordPress|メニューのカスタムリンクとは【使い方と編集】

では早速ですが、
WordPressで、カスタムリンクとは何か、使い方や編集について解説していきます。

今回は分かりやすく要点をまとめるために、以下について書いていきます。

 

WordPress カスタムリンク

  1. カスタムリンクとは
  2. 使い方・編集
  3. 応用編

こういった流れで解説していきます。

では始めていきましょう。

 

1. カスタムリンクとは

最初にメニューのカスタムリンクとは何か書いておきます。

カスタムリンクとは

カスタムリンクとは、任意のテキストに任意のURLでリンクを挿入して、自由にリンクを貼れる機能のことです。

WordPressでは、主にメニューを作成するときにカスタムリンクを使います。

 

↓例えば、私のこのブログであれば、ヘッダーメニューの「HOME」はカスタムリンクです。

ヘッダーメニューの「HOME」はカスタムリンク

 

この「HOME」部分では、HOMEというテキストに、トップページのURLを挿入してサイトトップにリンクできるようにしてあります。

カスタムリンクはこのようにしてメニューで使います。

 

 

2. カスタムリンクの使い方・編集

続いて、カスタムリンクの使い方と編集についてです。

まずは管理画面左メニューで、「外観」→「メニュー」に進みます。

 

↓編集したいメニューで、「メニュー項目を追加」の中から、「カスタムリンク」をクリックします。

カスタムリンク

 

 

↓カスタムリンクの作成欄が開きますので入力します。

カスタムリンクの作成欄が開きます

URLリンク先のURL
リンク文字列表示するテキスト

基本的にカスタムリンクで入力するのは、これだけです。上記の例では、HOMEへのリンクにしていますが、別サイトへの外部リンクなどでも大丈夫です。

入力したら「メニューに追加」をします。

 

 

↓カスタムリンクを、任意の順番に並べ替えます。

カスタムリンクを、任意の順番に並べ替えます

 

並べ替えたら、保存をします。

 

↓サイトトップに戻り、メニューを確認するとカスタムリンクのメニュー項目が設置されています。

メニューを確認するとカスタムリンクのメニュー項目が設置されています

 

 

応用編

続いて、カスタムリンクの使い方で応用編です。

ここでは、カスタムリンクを表示させつつ、リンク自体はクリックできないようにします。

 

↓例えば、階層化メニューの親部分です。

階層化メニューの親部分

このように階層化させたメニューの場合は、親部分のリンクは必要ありません。

しかし、リンクは無くても「Google」のテキスト部分は表示させたいです。

 

↓この場合は、カスタムリンクの作成で、URL部分に半角の「#」を入れておきます。

カスタムリンクの作成で、URL部分に「#」を入れておきます

 

もしくはURL部分を空白にしておいても大丈夫ですが、「#」を使う方がプロっぽいですね。

こうすることで、階層化メニューの親部分を表示させつつ、リンクは使わないようにできます。

 

↓こんな感じで、メニューが階層化されます。

メニューが階層化されます

 

親部分の「GAFA」は表示されていますが、リンクにはなっていないのでクリックできません。

カスタムメニューの基本的な使い方はこんな感じです。

 

あまり無いですが、メニューやカスタムリンクを他のサイトにする場合に、ブラウザの新規別ウィンドウで開きたい場合もあると思います。

その場合は、「WordPress|メニューのカスタムリンクを別ウィンドウで開く」で書いていますので、参考にしてください。

 

 

あわせて読みたい

 

WordPress 基本設定ガイド

 

 

そんな感じで、WordPressでカスタムリンクとは何か、使い方や編集方法でした。

これでカスタムリンクはバッチリです。

では。

 

おすすめ≫WordPress|おしゃれでSEOに強いおすすめの有料18テーマ【厳選】

おすすめ≫アフィリエイト|やり方・始め方:初心者はまずおすすめのASPに登録

 

このエントリーをはてなブックマークに追加

 

 無料オンライン体験レッスン可・プログラミング学習でスキルアップ!

WebデザインやHTML、CSS、サイトカスタマイズに関するプログラミング学習は、
プログラミングのオンラインスクールCodeCampがおすすめです。

特に、初心者でもHTMLとCSSの基礎を学んでおくと、ブログやサイトのデザインカスタマイズが圧倒的に上達してスムーズにできるようになります。

無料オンライン体験レッスンが可能なので、興味のある人は受講してみるといいです。当然、完全に初めての人でも問題ありません。

やはり自分のブログやサイトのデザインを自由にコントロールスキルが身につくと、サイト運営がとても楽になます。スキルアップもできるし、とても勉強になりますよ。

≫CodeCamp

-WP メニュー
-, ,

© 2020 OnoCode.