Luxeritasのヘッダーとフッターを操作してみよう!【ヘッダー/フッター編】

2018年9月26日ブログ管理Luxeritas, Luxeritasカスタマイズ, ブログ管理, 初心者

ヘッダー/フッターのヘッダー

トリ師匠
トリ師匠
次はヘッダーとフッターを設定してみるで!
ぐず夫
ぐず夫
へっだー? ふったー?
なんじゃそれ
トリ師匠
トリ師匠
簡単に言えばページの上部と下部の表示じゃの。そんではさっさといくで!

ということで、今回はLuxeritasのカスタマイズ機能を使ってヘッダー/フッターの設定をしてみます。

ヘッダー/フッター 機能

ヘッダー/フッター選択

トリ師匠
トリ師匠
ヘッダーとフッターは、Webページの上部(ヘッダー)と下部(フッター)に置かれるものでの。どのページが開かれても表示されるっちゅう部分じゃ。ここではその「ヘッダー」と「フッター」を設定するんじゃな。

 

① タイトルの配置

タイトルの文字をヘッダーのどこに表示させるかを設定します。なおタイトルを画像で設定している場合には非表示となります。

例:【左】に設定した場合…

ヘッダー左

例:【中央】に設定した場合…

ヘッダー中央

例:【右】に設定した場合…

ヘッダー右

 

◆サイトタイトルを画像にする詳細はコチラ!

② ヘッダーのマージン

ヘッダー領域の上の空間を指定します。

ヘッダー外設定
ヘッダー領域上の幅を設定

③ ヘッダーのパディング

ヘッダー領域内の空間を指定します。

● ヘッダー上
ヘッダー内、上部の空間を指定します。

ヘッダー領域上

 

● ヘッダー右
ヘッダー内、右部の空間を指定します。

ヘッダー領域右

 

● ヘッダー下
ヘッダー内、下部の空間を指定します。

ヘッダー領域下

 

● ヘッダー左
ヘッダー内、左部の空間を指定します。

ヘッダー領域左

④ ヘッダーの位置

ヘッダーの位置を設定することができます。

【 コンテナの内側 】
ヘッダーの横枠内に収める。(例:当ブログ)

【 コンテナの外側 】
ヘッダーの領域外を含める。

ヘッダー領域外

 

● ヘッダーを枠線で囲む
ヘッダー領域を枠線で囲む機能。(例:チェックなしの場合)

ヘッダー領域枠線無し
枠線が表示されない

 

● ヘッダーの枠線を横幅いっぱい
ヘッダー領域の枠線を横幅いっぱいに広げる機能

ヘッダー領域外枠線有り
ヘッダー領域外まで線が引かれる

 

⑤ フッターの位置

フッターの位置を設定することができます。

【コンテナの内側】
フッターの横枠内に収める
(※ 下、「フッターを枠内で囲む」と同様のため画像省略)

【コンテナの外側】
フッターの領域外を含める

 

● フッターを枠線で囲む
フッター領域を枠線で囲む機能

フッター枠有り
見えづらいが枠線が表示されている

 

● コピーライト表示部の上に線を入れる
コピーライト部上に線を表示する機能

Copyright上の線

 

● モバイル・スマホで非表示にする
モバイル・スマホ表示でフッターを表示させない機能。

 

⑥ フッターウィジェットエリア表示数

フッターのウィジェットエリアを設定します。ウィジェット設定は別途。

【横1列】
フッター部、中央のウィジェットを表示

フッター中央のみ

【横2列】
フッター部、左・右のウィジェットを表示

フッター左右

【横3列】
フッター部、左・中央・右のウィジェットを表示

フッター左・中央・右

トリ師匠
トリ師匠
これら設定を活用して、ヘッダーとフッターの見栄えを整えるんじゃ!

 

ヘッダーとフッターの設定を終えて…

ぐず夫
ぐず夫
面倒やけど、なんや見栄えが良うなってきた気がするの。
トリ師匠
トリ師匠
せやろ。やからあと26個、気張るしかないの。
ぐず夫
ぐず夫
に、26個、思い出したら吐き気が…

以上でヘッダー/フッター編のカスタマイズを終了します。

ではまた次回をお楽しみに!