このページは移転しました。

移転先はこちら→「ジェームズ・アレン・ネットをMovableTypeで構築

ジェームズ・アレン・ネットをMovableTypeで構築

 今回作成したジェームズ・アレン・ネットは、ウェブログツールMovableTypeで構築されています。というか、MTで全ページを作りました。どういう仕組みになっているのかをブロガーの皆さんのためにメモしておきます。中級~上級向け。

 見ていただければわかるように、ジェームズ・アレン・ネットの内容は、大きく二つに分かれます。

●【青色】最新ニュースやコラムなど、新しい記事を追加する必要のある部分。ここは一般的なブログスタイル。
●【黄緑】データベース部分。ここは新着順よりも内容別、また並び順もコントロールしたい。

 というわけで、この二つを別のブログで構築し、表紙にその両方の目次を表示させるという融合策をとりました(実はこれは女子十二楽坊資料館ですでに実験済だったのですが)
 具体的には、blog_id="1"……「ジェームズ・アレン・ネット」、blog_id="2"……「ジェームズ・アレン・データベース」となっています。

 ニュース&コラムの部分は特に説明いりませんね。ごく普通の構築です。表紙には最新記事2つ、それからカテゴリー別(ジャンル別と書いてありますが)に3件ずつ+カテゴリーアーカイブへのリンク。それから月別のリンク。MovableTypeの基本からそれほど外れてはいません。個別ページもそのままですね。

時系列順を無視する

 さて、問題はデータベース部分。
 目次は sort_by="excerpt"、つまり「概要」に数字を入れてその順に並べることにしました。日付順は意味がないので。こうやっておくと、MovableTypeで時系列順じゃないサイト(つまりブログっぽくないデータベースサイト)が作れます。

同じカテゴリーのエントリー一覧を表示させる

 individualのところでは、日付順に出てくる「前の記事」「次の記事」というmenuが逆に邪魔になるので、さっくり削除。しかし、同じジャンルの記事の目次は横に入れたいところです。
 そこで、まずカテゴリーアーカイブ用に、通常のものに加えてもう一つ、新しいテンプレート(Category Title)を用意。アーカイブの設定でのファイル名指定は「<$MTArchiveCategory dirify="1"$>t.html」。この中身はこれだけです。
<MTEntries sort_order="ascend" sort_by="excerpt">
●<a href="<$MTEntryPermalink$>"><$MTEntryTitle$></a><br />
</MTEntries>
 つまり、そのカテゴリーに含まれるエントリーの一覧だけを含むファイルができるわけですね。実例
 で、このファイルを各individual Entry archiveで読み込ませることにします。phpでもいいのですが、今回はSSIを使用しました。まず、individual Entry Archiveのファイル名指定で拡張子をshtmlにしておきます。そして、この「同じジャンルの記事へのリンク一覧」を読み込ませたいところに、次のように入れてみました。
<h2 class="sidetitle">このジャンルの<br />記事一覧</h2>
<div class="side">
<!--#include file="<$MTEntryCategory$>t.html" -->
</div>
 これで「このエントリーと同じジャンルの他のエントリーへのリンク集」が簡単に組み込めます。実例(右列「このジャンルの記事一覧」の中身がそうです)。phpでも同じようにして読み込むことが可能ですね。

 もちろん、これはテンプレート・モジュールを使えば完全に静的生成できるわけですが、いちいち全ファイルを再構築し直さなければならないという難点があるので見送りました。

複数ブログを同時に表示

 さて、MovableTypeでは、一つのMovableTypeで複数のブログを生成できるようになっています。この複数ブログを一括して扱うためのプラグインなどがあります。
 今回はGlobal ListingsMTOtherBlogを使用。どちらも似たような機能を持っているのですが、微妙に雰囲気が違います。
 <MTOtherBlog blog_id="1,2">この中でMTEntryやMTCategoryを使うと、OtherBlogでid指定した他のブログのエントリーやカテゴリーが読み込まれます。複数ブログを指定すると、それを並列的に読み込むようです。</MTOtherBlog>
 <MTGlobalEntries include_blogs="1,2">この中では複数のブログをもう一緒くたにして扱ってしまいます</MTGlobalEntries>
 まず、「最近のご意見ご感想(=コメント)」と「最近のトラックバック」については、とにかく両ブログ合わせて最新5件を表示させようと思ったので、GlobalListingsの方を使いました。
<h1 class="main-header">最近のご意見ご感想</h1>
<div class="listbox">
<MTGlobalEntries recently_commented_on="5">
◎<$MTEntryTitle$><br />
<MTComments lastn="3" sort_order="descend">
 ⇒<a href="<$MTEntryPermalink$>#comment-<$MTCommentID$>">[<$MTCommentAuthor$>]</a> <$MTCommentDate format="%m/%d %H:%M"$><br />
</MTComments>
</MTGlobalEntries>
</div>
<p> </p>
<h1 class="main-header">最近の参照元(トラックバック)</h1>
<div class="listbox">

<MTGlobalPings lastn="5">
◎<a href="<$MTPingURL$>" target="new"><$MTPingTitle$></a>(<$MTPingBlogName$>)[<$MTPingDate format="%m/%d %H:%M"$>]
<MTPingedEntry>
 ⇒<a href="<$MTPingedEntryLink$>#trackback-<$MTPingID$>">■</a>
</MTPingedEntry><br />
</MTGlobalPings>
</div>

トラックバックのところではMTPingedEntryプラグインも併用しています。

 それから、表紙の左端の黄緑欄、データベースの目次を表示させるところは、とりあえずMTOtherBlog blog_id="2"で挟むだけで済ませました。

<MTOtherBlog blog_id="2">
<MTCategories>
<h2 class="data-title"><$MTCategoryDescription$></h2>
<div class="blog">
<MTEntries sort_order="ascend" sort_by="excerpt">
●<a href="<$MTEntryPermalink$>"><$MTEntryTitle$></a><br />
</MTEntries>
</div>
</MTCategories>
</MTOtherBlog>
 MTOtherBlogで挟まれた内側については、ごく普通のデフォルトテンプレートと何ら変わらないことがわかると思います。違うのは<MTEntries sort_order="ascend" sort_by="excerpt">の並び順指定くらいですね。

 これで、時系列順ブログとデータベースを組み込んだサイトをMovableTypeだけで構築することができます。

更新のテクニック

「人生迷い箸: 更新Pingを受けて自動RebuildするCGI」を参考にして、データベースの方を更新したら自動的にニュース(表紙)の方を更新することにしました。
 つまり、ニュースのトップページが全体の表紙を兼ね、データベースの方はそのサブになるように仕立てたわけです。もちろん、これは逆も可能で、実際に女子十二楽坊資料館はデータベースがメイン、そこにニュースの記事を読み込むスタイルになっています。
 ただ、これは今は失敗したと思っています。ちょっとややこしい話ですが、データベースは目次(タイトル)だけ表示できれば充分ですが、ニュースはやはり本文を少し表示したくなります。そして「自動RebuildするCGI」は基本的に新しいエントリーを投稿したときしか更新してくれません。
 私の場合、ニュースにしろ、データベースにしろ、中身を書き換えることが頻繁にあります。とすると、女子十二楽坊資料館スタイル、つまりデータベースメインだと、ニュースの中身を更新したとき、もう一度表紙の方も再構築しないといけません。逆に、データベースのタイトルが変わることは滅多にないので、メリットが少なくなります。
 しかし、ジェームズ・アレン・ネット形式、つまりニュースの方がメインだと、データベースのタイトルが変わらない限り、普通に更新していればそれで済むわけです。

CSS

 アマゾン・アソシエイト広告リンクを入れたかったので、3コラム型になりました。本当は2列の方が見やすいと思うのですが……。女子十二楽坊資料館は左のデータベースが可変、ジェームズ・アレン・ネットは中央のニュースが可変になるようにしてあります。一応640ピクセルくらいの幅ならうまく見れると思うのですが、どうでしょう?

※w3c的には不十分なところもありますが多少は目をつぶっていただけると幸い。