飲食店専門ホームページ制作プラン

WordPressのグローバルメニューの作り方を完全初心者向けに図解【Cocoon例】

こんにちは。代表の銀河(@ginga_noguchi)です。

講義の受講者の方から「WordPressサイトのグローバルメニューの作り方がわからない」というご質問を受けたのでわかりやすく図解していきます。サンプルサイトは「Cocoon」をテーマにしていますが、どのテーマでもやることは同じです。

難しくありませんのでサクッとやっちゃいましょう。

目次

WordPressのグローバルメニューの作り方を完全初心者向けに図解

サイトの見た目やユーザービリティに大きく影響するグローバルメニュー。ヘッダーメニューやメインメニュといった言い方もしますが、「グローバルメニュー」に統一させていただきます。

WordPress初心者の方が多くつまづく箇所ですし、今後も何度も変更することになると思いますので今のうちに覚えておきましょう。「動画のほうがわかりやすい」という方はYouTubeをご覧ください。

メニューに入れるページの作成

まず前提としてグローバルメニューに設定したい項目を作る必要があります。代表的なものとしては

  • 固定ページ
    • プロフィール・会社案内・店舗紹介・院内案内など
    • サービス・事業案内など
    • お問い合わせ・採用情報など
    • ブログ一覧ページ
  • 個別のカテゴリーページ

なんかが多いんじゃないかなと思います。それぞれのページの作成方法を軽くご説明しますね。

固定ページ

STEP
【固定ページ】から【新規追加】

ダッシュボードの【固定ページ】から【新規追加】をクリックして任意のページを作成します。

STEP
スラッグ(パーマリンク)をわかりやすいものに

プロフィールページなら「profile」といった感じにURLとなる文字列をアルファベットで入力します。

カテゴリーページ

STEP
【投稿】から【カテゴリー】

ダッシュボードの【投稿】から【カテゴリー】をクリックしてカテゴリー一覧ページを開きます

STEP
任意のカテゴリーを作成
  1. 名前:任意のカテゴリー名
  2. スラッグ:カテゴリー名をアルファベットで入力
  3. 親カテゴリー:カテゴリーに階層を持たせたい場合は親を選択
  4. 説明:基本的に入力の必要なし
STEP
【新規カテゴリーを追加】をクリック

グローバルメニューの作成手順

メニューを作成する

STEP
ダッシュボードの【外観】から【メニュー】をクリック
STEP
グローバルメニューを作成する
  1. メニュー名:グローバルメニュー
  2. メニュー設定:【ヘッダーメニュー】と【フッターメニュー】にチェック
  3. 【メニューを作成】をクリック

メニューに入れたい項目を選択する

  • 固定ページ
  • 個別の投稿記事
  • 任意のURL
  • カテゴリー

からメニューに追加したい項目を選択します。【メニューに追加】をクリックすることで順番にメニューに追加されていきます。

メニューのデザインとカスタマイズ

メニューの順番を並べ替える

ドラッグアンドドロップで順番を入れ替えることができます。

また、右に少しずらすことで最大2段階まで階層を持たせることもできます。

設定しても2階層めまで表示されない仕様のテーマもあるのでご注意ください。

メニューの表記を変更する

STEP
表記を変えたいメニューの右側にある▼をクリック
STEP
【ナビゲーションラベル】に入力されているテキストを変更

ここを変更しても元のページやカテゴリーのタイトルは変更されません。

STEP
【メニューを保存】をクリック

メニューに英語表記を追加する(テーマによる)

STEP
メニューページ右上の【表示オプションをクリック】
STEP
【説明】にチェック
STEP
表記を追加したいメニューの右側にある▼をクリック
STEP
【説明】の欄にテキストを入力

メニューの色を変更する(Cocoonの場合)

STEP
ダッシュボードから【Cocoon 設定】をクリック
STEP
【ヘッダー】のタブをクリック
STEP
任意の項目を変更
  • ヘッダー全体色と文字色
  • ヘッダー色(ロゴ部)と文字色
  • グローバルナビメニュー色と文字色

上記6か所を任意の色に変更すれすればOKです。

色の選び方は以下のサイトが便利です

まとめ

無事にできましたでしょうか?これ見ても「わからないよー」というかたは記事に追記しますのでTwitterでご遠慮なくご質問ください。

WordPressは決して難しくはないのですが、慣れない作業が多く、特に最初のうちは見た目を整えたい箇所が多いので大変ですよね。1つずつこなしてイケてるブログを作っていきましょう。

「もうヤダ限界」という方は月額7,900円~でカスタムや更新を丸投げできるサービスを提供していますので、ご検討ください。

ご不明な点はご質問ください

制作費用は無料。月額7,900円~できるHP

制作費高い、維持費高い、更新できない、古い、ダサい、問い合わせこない……一般的なWeb制作を脱却する新サービス。最高のコストパフォーマンスを保証します。

初期費用49,800円が今なら無料

この記事が気に入ったら
いいね または フォローしてね!

よかったらシェアしてね!

この記事を書いた人

野口 銀河のアバター 野口 銀河 代表取締役

PC11株式会社代表取締役。鉄板焼レストラン&バー『葉山』を経営してます。大学2度中退→ホームレス→DJ→Web制作・ブロガー→法人設立。地元の飲食店が大金をかけずネットでも集客できるようホームページの自作・集客方法などを発信しています。コロナに負けるな沼津の飲食店。

目次
閉じる