製作するウェブサイトに統一感をもたせるため、共通のヘッダーを用意する必要がある場合は、システムのテンプレート(グローバルテンプレート)に、新たなテンプレートを用意し、それを各サイトで読み込んで利用するのが望ましい。
ここでは、グローバルヘッダーのほかに、それが読み込むスタイルシート(「グローバルCSS」)もシステムのテンプレートに用意する。
「グローバルヘッダー」
<!-- common header -->
<$mt:Include module="グローバルCSS"$>
<div id="common-header">
<div id="common-header-inner">
<div id="vrand-title"><a href="#">logo</a></div>
<$mt:Include module="サインイン"$>
</div>
</div>
<!-- common header end -->
「グローバルCSS」
<style type="text/css">
<!--
#common-header{
background:#fec303;
}
#common-header-inner{
width:910px;
height:80px;
margin:0 auto;
text-align:left;
}
#common-header-inner:after{
clear:both;
}
-->
</style>
上記2つのテンプレートが完成したら、システムテンプレートの「ヘッダー」を開き、「<div id="container">」の直前に、「<$mt:Include module="グローバルヘッダー"$>」を置いて保存する。
ブログはこれで完成だが(再構築は必要)、ウェブサイトのほうは、システムテンプレートの「ヘッダー」を読み込まないため、ウェブサイトの管理画面からテンプレートモジュール「メインページ」に移動して、同様に、「<div id="container">」の直前に、「<$mt:Include module="グローバルヘッダー"$>」を置く必要がある。
コメントする