MovableTypeブログでは、スタイルシートを加えたり、アクセス解析の記述をヘッダーに挿入とかヘッダーを触る機会が多かったのですけど、WordPressになると比較するとヘッダーはブラックボックスのようになっています。以前にGoogleのadsense審査コードとかヘッダーに貼るのも苦労しました。そんな数年に数回だけのブログカスタマイザーな私にはLuxeritasのカスタマイズ(外観)メニュー大変助かります。「ヘッダー／フッター」はホスティング会社のサービスやGoogleなどのアクセス解析 or Adsense認証コード、スクリプトを貼ったりする本文とは関係無いものを連絡通信場所として使うくらいの認識で「今回はざっと見るだけかな」と取り組みましたが、思わずヘッダーの背景色を加えてしまったりデザイン的に上下でいろいろ可能性があってコンテナに組み入れて記事部分と総合的にcssで設定できるのだと分かりました。そこまでしなくてもデザインに飽きてきたら「ヘッダー／フッター」「背景色/枠線色」ですぐに上下の変更がかなり自由にできます。
Luxeritasのカスタマイズメニューは一つ一つ見ていくと大半のことはLuxeritas」 カスタマイズ(外観) で事足りるようです。cssとか理解しなくてもダイナミックに変更をしなければ（いや、かなりダイナミックな変更さえも？）かなり可能です。欲張りなものでボタン一つで出来てしまうとまた別の変更もしたくもなりますけど。
以前に生半可な知識しかないのにサイトのデザイン変更をしようとしてcssとかHTMLとか変えていくうちに表示が崩れてどうにもならなくなった経験もあるので、luxeritasのカスタマイズ機能は助かります。cssの知識は、その時に変更したい箇所をどうすればいいのか？って時だけ必要で、こうして新しいフォーマットとかテーマとか導入しない限りHTMLとかCSS、Javascriptとか触らないですからすぐ忘れてしまいます。毎回css入門とかいうサイトを見ながらの変更でかなり時間が必要でした。
スポンサーリンク
タイトルの配置
ブログタイトルを左揃え、中央揃え、右揃えに配置できます。
「キャッチフレーズ」部分も記入されてあればブログタイトルと一緒に移動します。
このサイトは左にブログタイトルと「キャッチフレーズ」を持ってきています。
「中央」「右」への移動もプルダウンメニューを選択するだけ移動させられます。
ヘッダーのマージン
上部のマージン（その部分の外側に余白として何も無い領域）が設定できます。
マージンの数値を入れられるここの下に「ヘッダーのパディング」その下に「ヘッダーの位置」とあってその中に「ヘッダーを枠線で囲む」選択ができます。枠内がヘッダーになります。
わかりやすいのでヘッダー領域を視覚的に示すために「ヘッダーを枠線で囲む」にレ点を入れて選択するとヘッダー領域に枠がつきます。「ヘッダーのマージン」に10と数字を入れるとここではヘッダー上の外にマージンが10px設定されるので枠の外に10px分の空白ができます。
もっとわかりやすくするためにより広いマージンを作ってみます。マージン上100px設定して「ヘッダーを枠線で囲む」にしてみると、かなりブログタイトルが下に下がりヘッダー領域でない余白100pxができます。
適宜、上部に余白を設定できます。
ヘッダーのパディング
マージンはそこに含まれない外側の余白です。パディングは内側の余白になります。ヘッダーの大きさを見るために「ヘッダー位置」で「コンテナの内側」を選択して「ヘッダーを枠線で囲む」にチェック入れてブログタイトルと「キャッチフレーズ」の位置を見て数値を入れて調節します。デフォルトで数値が入っていて、そのままでもいいのかもしれませんがブログタイトルの大きさ、文字数によっては少し移動させる必要の場合もあるかもしれません。
ヘッダーの領域からパディングという空白数値を入れて上下左右どのくらいその枠から離して、挿入するか設定できます。枠は「ヘッダーを枠線で囲む」のチェックを外したら消すことができます。枠とブログタイトルは干渉させない設定もできるので、位置的なデザインだけで数値を決めてブログタイトル文字位置を設定します。
ヘッダーの位置
「コンテナの内側」「コンテナの外側」
「コンテナの内側」「コンテナの外側」の選択ができます。デフォルトのままヘッダーも記事部分もbackgroundの設定が白で同じだと上部のブラウザの違いをよく見ないと全くこの変更で何も起こっていないように見えますが、例えばcss編集でcontainerの設定：backgroundを変更した場合にヘッダーが内部にあれば同時に同じbackgroundに変更したりできるようになるわけです。「コンテナの外側」を設定した時にはヘッダーの背景色白色がヘッダーの左右のブラウザにその高さは広がっています。cssから背景色とか設定しないって方でも記事部分、ヘッダー部分のbackground設定はLuxeritas カスタマイズ(外観)「背景色/枠線色」で記事部分の背景色とヘッダー部分の背景色を同じにすればできます。至れり尽くせりです。
ヘッダーの背景色をブラウザの両端まで表示できるということはデザイン的にワイド画面で広がりを見せたいデザインなどでは色使いでかなり良くなるのではないでしょうか？「コンテナの外側」の選択の背景色の広がりをわかるように試してみました。
Luxeritas カスタマイズ(外観)「背景色/枠線色」をクリックします。
↓
ヘッダーの背景色が白になっているのを変更して#85c174と入力してグリーン系の落ち着いた背景色にしました。これは白だとわかりにくいので任意に色を選んだだけです。
↓
Luxeritas カスタマイズ(外観)「ヘッダー/フッター」をクリックします。
↓
「ヘッダーの位置」で「コンテナの外側」を選択します。
↓
サイトタイトルとキャッチフレーズ部分のヘッダーに設定した背景色が記事とサイドバーより左右にブラウザ一杯に表示されます。
↓
サイトタイトル部分だけブラウザの左右一杯に色が広がるのも、気に入らないという場合にサイトの記事とサイドバーが含まれるコンテナの幅に合わせての表示もできます。「ヘッダーの位置」で「コンテナの内側」を選択します。
↓
コンテナの幅で左右のヘッダーが切られてスッキリした感じがします。好みですけど。色を明るくすると左右に広がっていてもいいのかもしれません。
ヘッダーを枠線で囲む
ここにチェックを入れるとヘッダー部分の上と左右の枠に線が表示され、ヘッダーの外枠が視認できるようになります。
Luxeritas カスタマイズ(外観)「背景色/枠線色」でヘッダーの背景色を変更しましたがすぐその下に「ヘッダー枠線色」を変更できます。「ヘッダー枠線色」に#f73f38と記入しています。
↓
Luxeritas カスタマイズ(外観)「ヘッダー/フッター」をクリックします。
↓
「ヘッダーを枠線で囲む」にチェックします。これでヘッダーの外の枠に設定した#f73f38色の線がつきます。
線がつくだけで正直わかりにくいのでヘッダの背景色が白とかで枠線色が黒だと分かるかもしれません。
ヘッダーの枠線を横幅いっぱい
(コンテナの外側の時のみ有効)
ヘッダーとコンテナを別の領域とした場合のみに枠線もまた左右一杯に広げられます。枠がブラウザ一杯に広がるので表示は上部になります。
「コンテナの外側」を選択して、「ヘッダーを枠線で囲む」「ヘッダーの枠線を横幅いっぱい」にチェックします。Luxeritas カスタマイズ(外観)「背景色/枠線色」で枠線色を#d1305bと設定してあります。するとヘッダのマージン10pxと設定してある場合、ブラウザの上部に10pxの余白があってヘッダー部分上部の枠に#d1305b色の赤っぽい色がつきます。ヘッダ部分が背景色が淡い色だともうちょっと効果あるかもしれません。
フッターの位置
「ヘッダーの位置」よりもカスタマイズできる所は少なめですが一番下ですし、あまりここに凝ってみてもそこは見ない人が大半でしょう。
「フッターの位置」で見たように「コンテナの内側」「コンテナの外側」が選択できます。
デザイン的にはヘッダーと同じように「コンテナの内側」で記事部分とサイドメニューのコンテナと同じ幅になって、「コンテナの外側」ではブラウザの左右両端までフッター部分が広がります。
フッターを枠線で囲む
これにチェックを入れると「フッターの位置」で「コンテナの内側」を選択していると上と両サイドに枠線が入って、「コンテナの外側」だと上部に両サイドいっぱいに上部の枠線がつきます。ヘッダーの枠線ではコンテナの幅両サイドにヘッダーの位置を「コンテナの外側」選択しても残りましたが、フッターの枠線は「コンテナの外側」選択で左右の枠線は消えます。微妙に枠線の付き方がヘッダーとは変わります。
コピーライト表示部の上に線を入れる
フッターの枠線とは少しだけ変わってフッターの上部だけ枠線をつけることができます。
「フッターの位置」で「コンテナの内側」を選択していると、記事部分とサイドメニューのコンテナ幅だけフッターの上部に枠線がついて、「フッターの位置」で「コンテナの外側」を選択していると、ブラウザ左右いっぱいにその枠線が広がります。枠線の色も変更できます。Luxeritas カスタマイズ(外観)「背景色/枠線色」で「コピーライト表示部枠線色」で設定します。
フッターウィジェットエリア表示数
私のサイトのフッターにはウィジェットは何もないのですけれど、「ダッシュボード」メニューの「外観」→「ウィジェット」をクリックしてみると、フッターにはウィジェット設置場所としてフッター左、フッター中央、フッター右と用意されています。
Luxeritas カスタマイズ(外観)「ヘッダー/フッター」の一番下にこの「フッターウィジェットエリア表示数」メニューがあってこのプルダウンメニューに「横3列（左・中央・右）」、横2列（左・右）、横1列（中央）、非表示とあるのでウィジェットを挿入するエリアを有効にして、ウィジェットを挿入します。
例です
「ダッシュボード」メニューの「外観」→「ウィジェット」を表示させます。
カレンダーを「フッター中央（タイトルH4）」にドラッグしました。タイトルは「毎月のブログ」として「保存」をクリックします。
「フッターウィジェットエリア表示数」プルダウンメニューから「横1列（中央）」を選択すると「毎月のブログ」の名前の付いたカレンダーウィジェットが表示されました。めでたしめでたし。例として挿入しただけなのでもうありませんけど。何かしら表示させたい場合、フッターもこうやってウィジェット表示するようです。