カスタマイズ-ヘッダーナビ(グローバル)

サイトタイトルやキャッチフレーズの下に帯状に並ぶ「ホーム」などの固定ページへのアクセスを示すリンクたちをヘッダーナビ（グローバルナビ）と名付けられています。

Luxeritasでは配置とデザインなどカスタマイズメニューが用意されています。
スポンサーリンク

グローバルナビ表示

グローバルナビを表示させなくできます。デフォルトではチェックが入って表示になっています。

チェックを外すとタイトルとキャッチフレーズ下にあったヘッダーナビ（グローバルナビ）が全て消えます。

グローバルナビの位置

ヘッダー下部（ノーマル）

「□グローバルナビ表示」チェックした状態で「グローバルナビの位置」を「ヘッダー下部（ノーマル）」を選択するとタイトルとキャッチフレーズ下にヘッダーナビ（グローバルナビ）が表示されます。

ヘッダー上部

ヘッダーナビ（グローバルナビ）がタイトル上に来ます。

モバイルメニューの種類

豪華バージョン

モバイルでのヘッダーナビ（グローバルナビ）表示方法をSidebar、Pre、Next、Searchと表示するのが豪華バージョンになります。

グローバルナビのみ

「メニュー」だけの表示になります。

モバイルメニューの開閉方法

親と子を個別に開閉

「モバイルメニューの開閉方法」このメニューはヘッダーナビ（グローバルナビ）に親と子の設定が無ければどちらでも変わりありません。

ここまでのカスタマイズにおけるモバイル表示の説明はWordPressのPC画面で簡易的にモバイル表示したときの画像を使っています。ただ、「モバイルメニューの開閉方法」は細かくてわかりにくいのでiPhoneでの表示例を以下に示します。

ヘッダーナビ（グローバルナビ）の項目は「ホーム」「調べたり、見たり経験した口コミ情報です」「サイトマップ」と3項目の固定ページが設定されています。「調べたり、見たり経験した口コミ情報です」にだけ＋マークが□に囲まれて表示されています。これは固定ページに新規追加で「調べたり、見たり経験した口コミ情報です」を親として「購入一覧」というページを作ってあるので「調べたり、見たり経験した口コミ情報です」の下に「購入一覧」ページがあることを示しています。

ダッシュボードから「固定ページ」→「新規追加」で「購入一覧」をいうタイトルのページを作ってあります。

「購入一覧」をいうタイトルの固定ページ作成時に親ページに「調べたり、見たり経験した口コミ情報です」を設定してあります。そうした設定では「親と子を個別に開閉」を選択してあると親ページだけ表示され下の子ページがあると+マークが□に囲まれて表示されクリックすることで子ページタイトルが表示されます。つまり親と子ページのある固定ページを一度にモバイルで表示させないのが「親と子を個別に開閉」設定です。

一度に全開閉

「一度に全開閉」を選択して「保存して公開」をクリックします。これだけですと「親と子を個別に開閉」と変化はわかりません。

Menuをタップすると別ウィンドウにヘッダーナビ（グローバルナビ）が表示されます。「調べたり、見たり経験した口コミ情報です」とその子ページ「購入一覧」ページが一度に表示されます。「一度に全開閉」されています。

スクロール固定

スクロール固定とはサイト表示が下に長い場合、下部へスクロールしていくとサイトタイトル下にあるヘッダーナビはサイトタイトルと共に画面からは消えていってしまします。

↓

ヘッダーが見えなくなる下部へスクロールしても上部に常にヘッダーナビ（グローバルナビ）が上部に固定表示されるようになります。

小デバイスだけスクロール固定

↓

タブレット、スマホなどの小デバイスの時だけヘッダーナビ（グローバルナビ）が常に表示されます。

PCサイズだけスクロール固定

小デバイスではスクロール固定されませんが、PCサイズの表示の時だけヘッダーナビ（グローバルナビ）が上部に固定表示されます。

固定オプション

↓

ヘッダーナビ（グローバルナビ）を固定表示にした時にだけ利用できます。
スクロールバーを右にスライドさせるとヘッダーナビ（グローバルナビ）に陰が表示され、右にスライドさせるごとに陰が濃くなります。

スクロール固定で半透明にする

「スクロール固定」の設定時だけ有効となります。「スクロール固定で半透明にする」のチェックボックスにレ点を記入すると背景が半透明になってスクロールすると後ろ側が透けて見えます。

上スクロールの時だけ表示

ヘッダーナビ（グローバルナビ）は上へスクロールした時だけ表示され、下にスクロールしていくと消えます。

横幅の大きさ

ここでヘッダーナビ（グローバルナビ）に表示されているリンクの位置を変更できます。

横幅を自動リサイズ

デフォルトでは「横幅を自動リサイズ」になっています。もし別の表示になっていてヘッダーナビ（グローバルナビ）のリンクを左側に寄せて表示させたい場合は「横幅を自動リサイズ」を選択してください。

ヘッダーナビ（グローバルナビ）のリンク表示は左揃えで表示されていきます。

横幅を自動リサイズ（幅いっぱい）

ヘッダーナビ（グローバルナビ）のリンクを幅いっぱい使って表示させたい場合に、「横幅を自動リサイズ（幅いっぱい）」を選択します。

ヘッダーナビ（グローバルナビ）の幅にいっぱいに広がるようにリンクが表示されていきます。

全て同じ幅

ヘッダーナビ（グローバルナビ）のリンク表示が均等に並びます。

リンクとの間がきれいに等間隔に並びます。

中央揃え

「横幅の大きさ」の下にある「中央揃え」チェックボックスにレ点をチェックします。

ヘッダーナビ（グローバルナビ）のリンク表示が中央揃いで表示されます。

区切り線を付ける

なし

デフォルトでは「なし」になっていると思われますが、この場合はヘッダーナビ（グローバルナビ）に区切り線の無い状態です。

区切り線を付ける

「区切り線を付ける」にチェックを入れるとヘッダーナビ（グローバルナビ）のリンクとリンクの間に区切り線が挿入されます。

両端を含めて区切り線を付ける

左寄せになっている時には区切り線が入ったままで「区切り線を付ける」と「両端を含めて区切り線を付ける」は変わりがありません。

そこで「中央揃え」もチェックします。

リンクの両端にも区切り線が挿入されます。

ナビ文字色

ここからは主に文字と背景の装飾になります。

「色を選択」をクリックします。

カラーピッカーが表示されます。カラーピッカーの下には小さな四角の色の付いたボックスが並んでします。白黒基調なら白黒どちらか、それ以外の色の基調なら赤、橙、黄、緑、青、紫のどれかをクリックします。ピッカー上の白丸が選択する色になります。
色つきにする場合は赤のボックスをクリックしてもカラーピッカー上で黄色を選べば黄色を選択できます。カラーピッカーの右側にはスライダーがあって上側にすると色が濃く、下側にすると色が薄くなります。