モジュールを作って効率的なサイトに！　| トフでもできる！？テーマ開発講座

知識編

モジュールを作って効率的なサイトに！

ひきつづき、ぺージに必要なものをMT化していきましょう。
インデックスぺージにはフッターがあるのでそれを追加します。今回はシンプルに、ぺージタイトルを入れたものを作ります。

いままでのタグを使って表示させることができるね！

<footer class="footerArea">
    <div class="mt-container">
      <p class="footerArea_logo">
        <$mt:BlogName$>
      </p>
    </div>
</footer>

表示されました。

さて、今回作ったフッターもですが先につくったヘッダー、ナビゲーションなど…
どこのぺージにも共通する部分が出てきました。

これをほかのテンプレートにも何度書くのはめんどう…。何かいい方法はないかな？

必要な部分だけ使いまわせる小さいテンプレート、テンプレート・モジュールがあります。

テンプレート・モジュールは、モジュールにパーツ毎にタグを記入し、それをインデックステンプレートや、アーカイブテンプレートから呼び出して使います。

呼び出しのMTタグを１行書けばフッターをよびだせるので、インデックステンプレート側はすっきりしますね。
さらに、フッターに修正をする場合にもテンプレート・モジュールの中を変えれば、全ページのフッターが書き換わるのでとっても楽です♪
使いまわせるパーツは、モジュール化しておきましょう。

では、実際にヘッダーをモジュール化してみましょう！

デザイン＞テンプレートにテンプレート・モジュールの項目があり、ここから作成します。

今回はヘッダーのモジュールなので、名前をheaderとつけました。
モジュールはたくさん作ることができるので、わかりやすい名前をつけてあげてくださいね。

他テンプレート同様に、編集画面から記述ができます。そのモジュールが担う部分を書いて、保存しましょう。
今回はヘッダー内の内容をモジュール化するので、該当の部分をインデックステンプレートからコピーして持ってきます。

コピペでペタッともってこよう！

続いて、インデックステンプレート側を書き換えます。
モジュールを呼び出す際に使うタグはこちらです。

<$mt:Include module="モジュールの名前"$>

"モジュールの名前"部分には、つくったモジュールの名前を入れます。
先ほどheaderを作ったのでここは<$mt:Include module="header"$>ですね。
それを、モジュールheaderの内容を入れたい箇所に書きます。

これで保存すると…

先ほどと変わらずに表示されました！
同様にして、footer内のモジュールも作っておきましょう。