【画像付き】WordPressのメニューの作り方!初心者でも簡単に作れます【Lightning】

WordPressのメニュー作成にお困りではありませんか?ご安心ください!

本記事では画像付きで分かりやすく、初心者でも簡単にWordPressのメニューを作成する方法をご紹介します。メニューの作成手順やポイントを、わかりやすく解説しています。

ゆーそうと

あなたのウェブサイトの使い勝手を向上させるための第一歩を踏み出しましょう!

WordPressのメニューは情報を探しやすくするために必要

WordPressのメニューとは、ユーザーがサイト内を簡単に移動するためのナビゲーションツールです。

メニューを使いこなすことで、ホームページの使い勝手を向上させ、訪問者がサイト内のサブページやコンテンツに簡単にアクセスできるようになります。

WordPressのメニューの使用場面

WordPressのメニューは、ウェブサイトの構造を整える上で欠かせない要素です。主な使用場面として以下のようなものがあります。

メインメニュー

ホームページのトップメニューとして、主にヘッダーでサイト全体の主要なページにアクセスできるようにします。
例えば、ホーム、サービス、製品、お問い合わせなどが一般的なメインメニューの項目です。

フッターメニュー

ホームページのフッターに表示されるメニューです。フッターメニューにはプライバシーポリシーや利用規約、お問い合わせなどのリンクを配置します。

モバイルメニュー

スマートフォンやタブレットなどのデバイスで使いやすいメニューです。例えば、ハンバーガーアイコンをタップすると、ホーム、サービス、製品、お問い合わせなどの項目が表示されます。

WordPressのメニューの作り方

WordPressでメニューを作成する方法を、分かりやすく画像付きで解説します。初心者の方でも簡単にメニューを作成できるよう、以下の手順に沿って進めましょう。

今回はテーマ「Lightning」メインメニューを作ることを前提に、メニューの作成手順方法書いていきます。

SWELLやCocoon、Katawaraなどの数多くのクラシックテーマでもこの方法で作成できます。

メニュー作成の準備

メニューを作成する前に、必要な固定ページやカテゴリーが作成されていることを確認しましょう。準備が整ったら、以下の手順でWordPressのメニューを作成していきます。

メニューの作成と編集方法

外観 >「メニュー」を選択

WordPressのダッシュボードにログインし、外観にオンマウスし「メニュー」をクリックします。

STEP
1

新しいメニューを作成

このようにメニュー編集画面が表示されます。

「メニュー名」欄に任意のメニュー名を入力します。今回はメインメニューを作成しているのでここでのメニュー名は「メインメニュー」にしました。

次にメニュー設定ではメニューの表示位置を設定します。表示場所の設定欄には、テーマによって異なる表示場所(ヘッダーメニュー、グローバルメニュー、フッターメニュー、モバイルメニューなど)が表示されますので該当の場所にチェックを入れてください。
今回はHeader Navigationにチェックを入れました。

メニュー名とメニュー表示を設定できたら「メニュー作成」ボタンをクリックしてください。

STEP
2

作成したメニューに固定ページやカテゴリーを追加

メニューを作成したら、次にメニュー項目からメニューアイテムを追加します。
左側のパネルから「固定ページ」や「投稿」、「カスタムリンク」などの対応する項目の横にあるチェックボックスを選択し、「メニューに追加」ボタンをクリックします。

もし追加したい固定ページやカテゴリが見当たらない場合は、タブの「すべて表示」をクリックして全ての項目を表示させることもできます。

外部リンクを追加する方法

外部リンクを追加する場合は左側のパネルから「カスタムリンク」を選択し、

URL欄に外部リンクのURLリンク文字列にはメニューアイテム名を入力して「メニューに追加」をクリックします。

STEP
3

作成したメニューの表示位置の設定

固定ページなどを選択したら右側のパネルにメニューアイテムが入りました。

メニューアイテムの順序を変更したい場合は、右側のパネルで項目をドラッグ&ドロップすることで簡単に順序を変更できます。ドロップダウンメニューを作る場合もドラッグ&ドロップで少し頭を下げて配置すれば可能です。

メニューを新しいタブで開く設定

リンクを新しいタブで開くために、メニューページの右端上部にある「表示オプション」をクリックsいます。

その中にある「リンクターゲット」にチェックを入れます。

スクロールして作成中のメニューに戻り、新しいタブで開きたいメニューアイテムの▼マークをクリックしてください。

「リンク先を新しいタブで開く」をチェックして完了です。

メニューアイテムの削除方法

削除したいメニューアイテムの▼マークをクリックし、赤字で書かれている「削除」をクリックするとメニューアイテムが削除されます。

STEP
4

作成したメニューを保存&確認

メニューの順序や編集が完了したら、右下の「メニューを保存」ボタンをクリックして変更内容を反映させます。

メニューの更新を確認したら、必ず表側に移動してページの表示を確認してください。

ヘッダーにメニューが追加されました!

メニューアイテムの順序を変更した際に頭を少し下げたメニューアイテム「ご挨拶」は「会社紹介」にオンマウスすると出てきます。

STEP
5

便利なWordPressのメニュー用プラグイン紹介

メニューをより柔軟にカスタマイズするための便利なプラグインをご紹介します。プラグインを活用することで、メニューに特殊効果を追加したり、さらなるデザインオプションを利用することが可能です。

ゆーそうとITブログではメニューにがそうを設定できるプラグイン「Manu Image」を紹介しています。

まとめ:ナビゲーションの鍵を握るWordPressメニュー

WordPressのメニューはウェブサイトのナビゲーションの鍵を握る重要な要素です。この記事では初心者でも簡単にメニューを作成する方法を解説しました。

  • WordPressのメニューはユーザーがサイト内を移動するためのナビゲーションツールで、メニューを使いこなすことでホームページの使い勝手が向上し、訪問者が簡単にサブページやコンテンツにアクセスできるようになる
  • メニューの使用場面として、メインメニュー、フッターメニュー、モバイルメニューなどがある
  • メニュー作成前の準備や作成〜確認方法まで解説
ゆーそうと

WprdPressの使い勝手を向上させるために、ぜひメニューの作成にチャレンジしてみましょう!

おまけ:メニューを追加しても表示されない場合はリニューアルをおすすめします

メニューを追加しても表示されない場合があります。

特にオリジナルテーマの場合ですが、テーマに直接WordPressのメニュー機能が使えな苦なっているケースがあります。

以下の画像はオリジナルテーマでメニューが直書きされている例です。(実在のオリジナルテーマではありません。)

このようになっている場合、残念ながらPHP等の知識がない場合はご自身ではどうすることもできません。

自分でWordPressからメニューを追加できるようにしたい!という方はテーマを変更をしてリニューアルを行うことをおすすめします。

ゆーそうとでは、お客様の現行のホームページのデザインをなるべく維持しつつ、メニュー設定などのWordPressの機能を使えるようなホームページにリニューアルが可能です!

\気になる方はお気軽にお問い合わせください!/

ホームページの新規作成・リニューアルで
お困りの担当者様へ

WordPressの機能を活かして運用しやすいホームページを作成

せっかくのWordPressなのに「自分で文章が書き換えられない」「ブログの更新ができない」などWordPressの機能を活かしきれていないことはありませんか?

ゆーそうとではWordPressの機能を最大限発揮して、HTMLなどの知識がないお客様でも運用しやすいホームページを作成します。

この記事のご依頼・お問い合わせの方はこちら