MovableTypeの最近のブログ記事

MTのレイアウトや内容の変更をする時、
メインページやカテゴリーページなど同じ訂正を数回しないといけません。
これを一発で変更できる方法がモジュールにしちゃえー！なのです。

<$MTInclude module="★★★"$>　タグを使います。

「テンプレート」-「モジュール」で新規作成。

例えばヘッダー部分(タイトルバナー部分等)を一発変換したい場合、
ヘッダー部分のタグすべてをモジュールにコピペします。
そしてアルファベット限定のタイトルをつけます。
例えば「header」とします。

これでモジュールのほうは保存でOK。

それぞれのテンプレートには
「header」の場合

<!--ヘッダー-->
<$MTInclude module="header"$>
<!--/ヘッダー-->

こんな感じになります。
そしてヘッダー部分の最初にあったタグと入れ替えたらOKです。

これでヘッダー部分に変更があった場合、
モジュールの「header」を修正するだけですむようなります。

ヘッダー、フッター、３カラムなど、各パーツ別に作ると便利ですよ。

↓こんな感じです。私はヘッダー部分を「バナーとナビ」にしてみました。

<!--コンテンツ・バナーとナビ-->
<$MTInclude module="banner-nav"$>
<!--/コンテンツ・バナーとナビ-->

<!--コンテンツ左-->
<$MTInclude module="alpha(left)"$>
<!--/コンテンツ左-->

<!--コンテンツ右-->
<$MTInclude module="gamma(right)"$>
<!--/コンテンツ右-->

<!--フッター-->
<$MTInclude module="footer"$>
<!--/フッター-->

元のスタイルのままだとあまりにもタイトルと記事との間が狭かったので

広げてみました。

スタイルシートの記事部分、

　　　　　.entry-content { margin: 5px 0;
　　　　　　　↓
　　　　　.entry-content { margin: 20px 0;

に変えたらできました。この場合、記事の上下が20pｘあくという意味です。

下は空けたくないときは　20px 0px 0px 0px とそれぞれ指定すればOK。

.date-header
{
margin: 5px 17px 0 0;
padding: 0 0 5px 0;
color: #09c;
font-size: 11px;
text-transform: uppercase;
}
/* 記事タイトル */
.entry-header
{
margin: 5px 0;
padding: 15px 0 0 33px;
background: url(maru.gif) 0 0.20em no-repeat;
color: #6f6fff;
font-size: 18px;
font-weight: bold;
}

.entry-content { margin: 20px 0;
}

記事について、日付順に並んでいますが、
古い順・新しい順をそれぞれテンプレートごとに変える方法です。

テンプレートの記事部分にある(３カラムだと「beta」部分)

<MTEntries sort_by="created_on" sort_order="descend">　のところ。

　　　　　ascend：昇順(古い順)
　　　　 descend：降順(新しい順)

これを変える事により「設定画面」で指定した表示順は無視されます。

<div id="beta">
<div id="beta-inner" class="pkg">
<p class="content-nav">
<a href="<$MTBlogURL$>">メイン</a>
</p>
<!-- <h5 id="archive-title">++<$MTArchiveTitle$>++</h5> -->
<h5 id="archive-title">++<$MTCategoryDescription$>++</h5>

<MTEntries sort_by="created_on" sort_order="descend">
<$MTEntryTrackbackData$>