【図解】Cocoonでグローバルナビ(ヘッダーメニュー)を作成する手順

★悩み★
・Cocoonで作成したサイトのヘッダーにカテゴリーへのリンクを載せたい。
・Cocoonでグローバルナビ(ヘッダーメニュー)の作り方を知りたい。


こういった「悩み」に答えます。

★本記事の内容★
① Cocoonでグローバルナビ(ヘッダーメニュー)を作成する手順をご紹介


これからご紹介する「Cocoonでグローバルナビ(ヘッダーメニュー)を作成する手順」を実践したことで、筆者は10分以内でWordPressのCocoonで作成したサイトにグローバルナビ(ヘッダーメニュー)を作成できました。

本記事では「WordPressのCocoonでグローバルナビ(ヘッダーメニュー)を作成する手順」を図を用いて解説します。

この記事を読み終えることで、「WordPressのCocoonでグローバルナビ(ヘッダーメニュー)を作成する手順」を把握した状態になります。
 

★グローバルナビ(ヘッダーメニュー)とは★
グローバルナビとは、Webサイトの全ページに設置されるリンクのことです。
グローバルナビ(ヘッダーメニュー)は、ヘッダー部分に設置されたグローバルナビ(下図の赤枠)のことを指します。

 

グローバルナビ(ヘッダーメニュー)とは

 

Cocoonでグローバルナビ(ヘッダーメニュー)を作成する手順

「Cocoonでグローバルナビ(ヘッダーメニュー)を作成する手順」に関してご紹介します。

★Cocoonでグローバルナビ(ヘッダーメニュー)を作成する流れ★
手順1:WordPressのCocoonをインストールとセットアップ
手順2:WordPressでカテゴリーを作成
手順3:WordPressのCocoonでグローバルナビ(ヘッダーメニュー)を作成


上記の流れで、WordPressのCocoonでグローバルナビ(ヘッダーメニュー)を作成できます。

以降で、「Cocoonでグローバルナビ(ヘッダーメニュー)を作成する流れ」の各手順に関してご紹介します。

手順1:WordPressのCocoonをインストールとセットアップ

「手順1:WordPressのCocoonをインストールとセットアップ」に関してご説明します。
 

Cocoonは、WordPressの無料テーマの1つです。


「WordPressのCocoonのインストール」と「WordPressのCocoonのセットアップ」に関しては、以下の記事をご覧ください。

既にWordPressにCocoonをインストール済み/セットアップ済みである方は、本手順を省略してください。


以上で、「手順1:WordPressのCocoonをインストールとセットアップ」は完了です。

手順2:WordPressでカテゴリーを作成

「手順2:WordPressでカテゴリーを作成」に関してご説明します。
 

グローバルナビ(ヘッダーメニュー)にカテゴリーへのリンクを載せるために、カテゴリーを作成しましょう。


Webブラウザで、WordPressの管理画面を開きましょう。
続いて、「投稿」配下にある「カテゴリー」(下図の黄色枠)をクリックします。

以下の情報を入力し、「新規カテゴリーを追加」ボタンをクリックし、カテゴリーを作成しましょう。
・名前(下図の赤枠):サイト上で表示される名前です。
・スラッグ(下図の青枠):URLに適した形式の名前です。
 

 

既にWordPressにカテゴリーを作成済みである方は、本手順を省略してください。


以上で、「手順2:WordPressでカテゴリーを作成」は完了です。

手順3:WordPressのCocoonでグローバルナビ(ヘッダーメニュー)を作成

「手順3:WordPressのCocoonでグローバルナビ(ヘッダーメニュー)を作成」に関してご説明します。
 

先ほど作成したカテゴリーをCocoonのグローバルナビ(ヘッダーメニュー)に設定しましょう。

 

まずは、Webブラウザで、WordPressの管理画面を開きましょう。
続いて、「外観」配下にある「メニュー」(下図の赤枠)をクリックします。
 

cocoonでグローバルナビ(ヘッダーメニュー)を作成


次に、「新しいメニューを作成しましょう。」(下図の赤枠)をクリックします。
 

cocoonでグローバルナビ(ヘッダーメニュー)を作成


続いて、以下の情報を入力し、「メニューを作成」(下図の赤枠)をクリックします。
・メニュー名(下図の青枠):ヘッダーメニュー
 

cocoonでグローバルナビ(ヘッダーメニュー)を作成


次に、「カテゴリー」(下図の赤枠)をクリックし、「すべて選択」をクリック後、「メニューに追加」(下図の青枠)を押しましょう。
 

cocoonでグローバルナビ(ヘッダーメニュー)を作成


最後に、「ヘッダーメニュー」と「ヘッダーモバイルメニュー」(下図の青枠)をクリックし、「メニューを保存」(下図の赤枠)をクリックしましょう。
 

cocoonでグローバルナビ(ヘッダーメニュー)を作成

 

グローバルナビ(ヘッダーメニュー)作成前後の本サイトは、以下となります。


【グローバルナビ(ヘッダーメニュー)を作成する前】

cocoonでグローバルナビ(ヘッダーメニュー)を作成


【グローバルナビ(ヘッダーメニュー)を作成した後】

cocoonでグローバルナビ(ヘッダーメニュー)を作成


以上で、「手順3:WordPressのCocoonでグローバルナビ(ヘッダーメニュー)を作成」は完了です。
 

上記の3手順で、Cocoonで作成したサイトにグローバルナビ(ヘッダーメニュー)を作成できました。

 

【まとめ】Cocoonでグローバルナビ(ヘッダーメニュー)を作成する手順

今回の記事を通して、「Cocoonでグローバルナビ(ヘッダーメニュー)を作成する手順」をご紹介することで、以下の悩みを解消しました。

★悩み★
・Cocoonで作成したサイトのヘッダーにカテゴリーへのリンクを載せたい。
・Cocoonでグローバルナビ(ヘッダーメニュー)の作り方を知りたい。


Cocoonでグローバルナビ(ヘッダーメニュー)を作成する手順?」で悩んでいるあなたにこの記事が少しでも役に立てれば幸いです。

コメント

タイトルとURLをコピーしました