参考にしたのは【作成・カスタマイズ講座】。最初に、どのようなタイトル部分の構成にしたいかを頭の中でイメージ化した後に、必要となるバナーを作成。上記にある通り、「配布用にも使えるロゴバナーとして468×60」のもの一つと、「広告用スペースのためのダミーバナー、サイズは234×60」を一つ。後者はあくまでも仮のものなので、空白に「AD Banner」と書いておしまい。前者も稚拙なスキルでちまちまと描いてそれなりに完成。一つ注意するとすれば、横に二つ並べる予定なので、高さを揃えておくこと。そうでないと並べた時に見た目が悪いしレイアウトがゆがむ。

次にメインテンプレートの差し替え。

と記述してある部分がタイトル部分。タイトルをH1で表示し、トップページへジャンプするようにクリッカブル指定、H2でブログの概要説明テキストを表示という表記になっている。

ブログのタイトル表記はバナーがその役割を果たすので省略し、代わりにブログの概要部分をH1に指定する。そしてその直後にHREFでクリッカブル指定したバナーを二つ並べる。

ジャンプ先URLは、左側(タイトルロゴ用バナー)はもちろんトップページだが、右側の広告バナーは臨機応変。上記の例では、掲載したバナーにあわせ年賀状特集ページへ飛ぶようになっている。

もちろんこれで終了してしまうと、本来タイトル用に大きな文字で指定していたH1のスタイルでブログの概要(＜$MTBlogDescription$＞)が表示されてしまうので非常に間が抜ける。そこで、スタイルシート中タイトル部分の指定を変更。

例えばこんな感じ。文字の色は背景色と見比べて目立つよう(同化してしまわないよう)にする。

これでひとまず完成。メインテンプレートだけでなく、カテゴリー、個別、日付アーカイブそれぞれのテンプレートも同様に修正し、再構築すればおしまい。

ただしこのままだと、ブログ内検索機能を使った時の結果ページがデフォルトのままになる。Movable Typeをアップロードしたサーバの、cgi/mt/serch_templatesフォルダ内にあるdefault.tmplを同じように編集し、アップロードするのを忘れないように。検索画面の編集もテンプレート管理画面でできればスマートなんだが。

後ほど、テンプレートによってはこの部分をさらにいじることになるのだが、それはその時にあらためて。