【Cocoon】ヘッダーやフッターを設定してみよう！

こんにちは！
みなさんはサイトを運営するにあたり、ヘッダーやフッターを設定していますか？

今回はCocoonのヘッダーやフッターを設定する方法をご紹介したいと思います。

ヘッダー、フッターってなに？

サイト以外でも「ヘッダー」「フッター」を聞いたことはありませんか？

ものすごーく簡単にいうとこのあたりです！

当ブログではここの部分になります！

• ヘッダー

• フッター

設定するメリットとは？

ではなぜヘッダーやフッターは設定した方が良いのかという疑問になりますよね。
設定されていると読者にとてもわかりやすく、見やすいと思いませんか？

例えば検索で当ブログにアクセスした方で他の記事も見たいな〜と思ってくれたとします。

サイドバーから遷移してくれる場合もありますが、、、私はヘッダーから巡回することが多いです。
ヘッダーは目につきやすいですよね〜。
またホーム画面に戻りたい時はヘッダーに設置されているとより読者に親切で良いですよね^^

フッターの場合は「サイトマップ」「お問い合わせ」などを設置することが多いですね。
企業のホームページだと「会社情報」「採用情報」が設置されていることをみたことありませんか？
私は就職活動や転職活動の際によく見てました^^

ヘッダー、フッターを設定してみよう！

早速設定していきたいと思います。

ヘッダーロゴの設定

私が一番上に設定している画像が「ヘッダーロゴ」になります。
ヘッダーロゴを設定したい場合の手順をご紹介致します。

左側の「Cocoon 設定」→「ヘッダー」をクリックしてください。

下の方にある「ヘッダーロゴ」で画像を設定できます。

「変更をまとめて保存」を押し忘れに注意してください。
保存しないと反映されません！！

以上がロゴの設定方法でした！

メニュー作成方法

次はヘッダーのやフッターを設定するために必要なメニュー作成方法になります。
実際の画面ではここの部分になります。

左側の「外観」⇨「メニュー」をクリックしてください。

私の場合は設定をされているため色々と表示されています。
まずは「メニュー」を作成していきます。
すでに作成済みで新しくメニューを作成する場合は「新しいメニューを作成しましょう。」をクリックします。

新しく作成する方は「新規メニューを作成」をクリックしてください。
クリックするとメニューを作成する画面になります。

ここでヘッダーかフッターかにチェックを入れてくださいね。
※モバイルもここで設定します。
今回はこのように入力してみました。「メニューを作成」をクリックします。

メニュー選択

作成したメニューが選択されています。
過去に作成したメニューもプルダウンで選択可能になります。

メニュー構造の説明

作成するとこのような画面になっていると思います。

• メニュー名

先ほど作成したメニュー名になります。プルダウンに表示される名前です。
変更したい場合はここで変更可能です。

• メニュー項目追加

青枠の項目はメニューで表示させたい項目を選択します。
例えば、カテゴリーなど。。。
設定方法は後ほどご説明します^^

• メニュー設定

緑の枠では作成時に選択した値が選択されていると思います。
変更したい場合はこちらで変更します。

以上がメニューの作成方法になります。
変更したら必ず保存してくださいね。
メニューを削除したい場合は左下の「メニュー削除」をクリックしてください。

次はいよいよ項目を追加していきますよーー！

メニュー項目を追加してみよう！

それではメニュー項目を追加していきます。
左側にある「メニュー項目を追加」の部分から設定していきます。

固定ページや投稿記事、カテゴリーなどから表示させたい項目を選択します。

ではカテゴリーから追加してみたいと思います。
「カテゴリー」をクリック⇨追加したいカテゴリーをチェック⇨「メニューに追加」をクリックします。

追加すると右側に追加されましたよね！

今回はそのままで「メニューを保存」をクリックします。

ではどのようになったか見てみます。
このような感じで設定されました！！

メニュー設定を複数選択

メニュー設定を複数選択することも可能です。

例えば、モバイル用もPC用も同じメニューを表示したいですよね。
それぞれのメニューを作成して、項目を追加したとします。
新しくカテゴリーが追加された場合、それぞれのメニューを変更しなくてはなりません。

とてもめんどくさい！！！！！！
設定し忘れてしまったりしますよね。。

なので、一つのメニューに複数選択をすることも可能です^^
手順はとても簡単。
メニューの位置から複数チェックするだけです！！！！！
保存をすれば反映されます^^

以上がメニューの設定方法でした！！
これでヘッダーやフッターを設置してみてください^^

ラベルの変更

メニューの項目名をカテゴリー名ではなく違う名前に変更したいときもありますよね。
その場合は「ナビゲーションラベル」から変更ができます。

全部変更してみました。ぜひ設定してみてください^^

まとめ

いかがでしたか？？
メニューを設定しているとサイトの雰囲気もだいぶ変わってきますよね！

まだ設定してない方はこの機会に設定してみてください٩( ᐛ )و
最後までお読みいただきありがとうございましたーーー！！！！