※ 元は「ヘッダーメニュー」のページ。2025年、「ヘッダー、フッター、サイドバー制作」のページにリニューアル
「WordPressの設定」の続き。
ブログを作り始めて、真っ先に手を加えたくなる箇所は、
ページの外観とりわけタイトルが入るヘッダー header。
ヘッダー、フッター footer、サイドバー sidebarは、
ブログの上・下・横。
WordPress使い始めの頃は、ウィジェットやメニューの使い方が分かりにくかった。
慣れ。
ウィジェット Widgetは、いわゆるブログパーツ。
外観 － ウィジェット
の画面左に
・ ［サイト内］検索
・ タグクラウド
・ ［投稿］カレンダー
などのブロック＝ウィジェット（ブログパーツ）が並んでいる。
作成したプロフィールや固定ページなどもウィジェットとして使える。
画面右にブロックをドラッグして、ブログの好きなところに設置できる。
WordPressインストール後、既にいくつかサイドバーに入っていたが、
・ ［サイト内］検索
・ カテゴリー
・ プロフィール
・ アーカイブ
の４つを入れた。
＋）アーカイブの代わりに人気記事を入れたブログもある。
ヘッダーメニュー、フッターメニューもウィジェットとみなせるが、こちらは
外観 － メニュー
にて作成・設置する。
ヘッダー、サイドバーは、PCとモバイルで表示が異なる。
PC用、モバイル用２通り作るのは大変だが、
レスポンシブデザイン対応のテーマを使えば、適宜切り替えて表示してくれるので助かる。
以下、テーマをインストールした後の作業。
ヘッダー制作
ヘッダーのうちタイトルは、最初、
設定 － 一般［設定］のサイトのタイトルが表示される。
当ブログの場合、「半永久ネット」の文字。
画像に変えたい場合、
外観 － ヘッダーや外観 － 背景もあるが、
（インストールした）テーマでも設定できる。
※ 当ブログはCocoonを利用
Cocoon設定 － ヘッダーに
ヘッダーロゴ、ヘッダー背景画像の項目がある。ここに各々アップロードした。
ヘッダーメニュー
ヘッダーメニューは、タイトル下の「帯」部分。グローバルナビ［ゲーション］メニューとも。
当ブログは（今のところ）親ブログのリンク１つ張っただけだが、
親ブログのヘッダーメニューのメニュー項目は６つ。
スマートフォンの場合、メニュー項目を増やしすぎるとメニューが画面の多くを占有してしまうので、最大４～６ぐらいまでに抑えたほうが良さそう。
Cocoon 『グローバルナビのメニューを設定する方法』（wp-cocoon.com/header-menu/）
外観 － メニュー － メニューを編集で、
メニューを作成（例えばメニュー名：header）。
画面左のメニュー項目を追加から
・ 固定ページ
・ 投稿
・ カスタムリンク
・ カテゴリー
を選択して、画面右のメニュー構造へ移していく。
チェックして「メニューに追加」もしくはドラッグ。
上の画面は昔のキャプチャーなので、今とはメニューが違っている。
コロコロ変わっている。
副項目（サブメニュー項目）は、メニュー項目の右側にある矢印をクリックして、「移動」の「○○○ 下の階層」を選択する。
ただし、スマートフォンなどのモバイルでは表示されない。
仕様のようだからしようがない。
ナビゲーションラベルとは別に「説明」を加えることもできる。
Cocoon 『グローバルナビに補足説明文を記入する方法』（wp-cocoon.com/global-menu-item-caption/）
そのままだと「説明」欄は表示されない。
画面の一番上にある
表示オプションの「詳細メニュー設定を表示」の「説明」にチェックを入れると
「説明」欄が表示される。
作成し終えたら、
メニュー設定 － メニューの位置のヘッダーメニューとヘッダーモバイルメニューにチェックを入れて、
メニューを保存。
位置を管理から選んでも同じ。
モバイルメニューについて
メニューの副項目（サブメニュー項目）は、モバイルではメニューの下に表示されない。
その代わり、モバイルメニューの横三本バー（ハンバーガーメニューという名がある）をタップするとメニュー、サブメニューが表示される。
モバイルメニューは、Cocoonの場合、フッターモバイルボタンがデフォルト。
Cocoon設定 － モバイルのモバイルメニューで、
ヘッダー・フッターモバイルボタンに変更すると
ヘッダーにもモバイルメニューが表示される。
フッターにあったメニューボタンと検索ボタンがヘッダーに移った。
モバイルボタンの「常にサイトヘッダーロゴを表示する」がチェックされていれば、ロゴも表示される。
フッターのモバイルメニューには新たにシェアボタンが加わった。
フッター制作
フッターは
© 2019 ふシゼン
と表示していただけの箇所。
当ブログの場合、
© 2025 半永久ネット
自動表示。
Cocoon設定 － フッターのクレジット表記から選択。
そろそろGoogleアドセンスに申し込んでみようかな、という段階になって
サイトマップ、お問い合わせ、プライバシーポリシー
の３項目をフッターに設置した。
フッターづくりもヘッダーづくりとほぼ同じ。
・ 固定ページでサイトマップ、お問い合わせ、プライバシーポリシーのページを各々作成
・ 外観 － メニュー － メニューを編集で、
メニューを作成（例えばメニュー名：footer）
・ メニュー項目を追加の固定ページから
サイトマップ、お問い合わせ、プライバシーポリシーを
メニュー構造へ移す（チェックして「メニューに追加」もしくはドラッグ）
※ お問い合わせ、プライバシーポリシーは、親ブログで固定ページ作成済みなので、２つめのブログ以降は、そのURLをカスタムリンクで指定
あとは、
メニュー設定 － メニューの位置のフッターメニューにチェックを入れて、
メニューを保存。
※ フッターモバイル［ボタン］にチェックを入れてスマートフォンで確認したらサイドバーが表示されなくなったので、チェックしない
位置の管理（今は位置を管理）は、下の画面のとおり。
