MovableTypeでエントリー中に関連記事リストを表示させる

「GIGAZINE（ギガジン）」といえば、知らない人はいないでしょう。　日々新発売のお菓子のレビューから最新のIT技術記事、海外の奇怪な現象までも網羅するモンスター級のニュースサイトです。

GIGAZINEで秀逸な機能といえば記事本文の下に表示される「関連記事」があります。

関連記事はその名の通り、記事本文と関係がある、もしくはつながりがある他の記事へのリンクをリスト形式で表示している部分。

おそらく詳細化されたカテゴリー情報、あるいはタグキーワードによる分類を用いて表示されていると思うのですが、記事読後に残った知的好奇心をくすぐられ、ついついクリックしたくなってしまいます。

最近ではサイトの質を評価する基準として「サイト滞在時間」が重要視されてきていますので、サイトの価値を高めるのにも非常に良い機能ではないかと思います。

そこで、MovableTypeでもこの「関連記事」機能を実装してみましょう。

MovableType4.x用のカテゴリー関連記事表示

MovableType4.xについては便利な<MTSetVarBlock>タグや、<MTIf>タグがありますのでエレガントに組み合わせます。

<MTSetVarBlock name="catList"><MTEntryCategories glue=" OR "><$MTCategoryLabel$></MTEntryCategories></MTSetVarBlock>
<MTSetVarBlock name="baseTitle"><$MTEntryTitle$></MTSetVarBlock>
<h2>関連記事</h2>
<ul>
<MTEntries lastn="6" categories="$catList">
<MTSetVarBlock name="relatedTitle"><$MTEntryTitle$></MTSetVarBlock>
<MTIf name="relatedTitle" ne="$baseTitle">
<li><a href="<$MTEntryLink$>"><$MTEntryTitle$></a></li>
</MTIf>
</MTEntries>
</ul>

ポイントは掲載したい記事リスト数＋１の数を「lastn」に設定することです。　関連記事リストには現在見ている記事そのものも含まれているので<MTIf>で除外しました。　でもそれでは件数が１件減ってしまうので、１件余分にリストアップしておくんですね。

※MovableType3.x用の関連記事表示については次の項目に掲載しています。

MovableType3.x用の関連記事表示

この関連記事表示機能はmt-relatedentriesプラグインを利用すればあっさりと出来てしまうのですが、ユーザー登録が必要なので、イヤな方もいらっしゃるかもしれません。

というわけで、ちょっと違った方向で作っていくことにしましょう。

追記：日本の方が作成されたTagSupplementalsプラグインというのもあります。　関連度をタグに限定して表示させたい場合はお勧めです。無料で使用できます。

まず、mt-relatedentriesプラグインとは異なる２つのサードパーティー製プラグインを入手します。

MTTagInvoke (MTタグ中にさらにMTタグの情報を含めることができる非常に便利なプラグイン)
Compare Plugin for MovableType (MTタグ内で条件分岐を可能にするプラグイン)

MTTagInvoke、Compare Plugin for MovableType とも、解凍後MovableTypeのpluginsディレクトリに直接放り込めば使えるようになります。

その１：エントリー個別記事の中で、同じカテゴリーの記事一覧を表示

MovableTypeで「え？これ標準機能で出来ないの？」と思ってしまうのが「エントリー個別記事の中で、同じカテゴリの記事一覧を表示」するという機能です。　これをMTTagInvokeプラグインを使って<MTEntries>の中でカテゴリーを指定してしまおう、というわけです。

<h2>関連記事</h2>
<ul>
<MTTagInvoke tag_name="MTEntries">
<MTTagInvokeAttribute name="category"><$MTEntryCategory$></MTTagInvokeAttribute>
<MTTagInvokeAttribute name="lastn">5</MTTagInvokeAttribute>
<MTTagInvokeContent>
<li><a href="<$MTEntryPermalink$>" title="<$MTEntryTitle$>"><$MTEntryTitle$></a></li>
</MTTagInvokeContent>
</MTTagInvoke>
</ul>

上の例では、カテゴリーを指定して、最新の5件を表示するようにしています。　一応これで（同一カテゴリーという意味での）関連記事を表示させることができました。

その２：エントリー個別記事の中で、同じタグキーワードを含む記事一覧を表示

関連記事を出したい人の中には「いやいや、いちいちカテゴリーなんて作ってられないよ。　タグキーワード分類に決まってるじゃん。」というようにタグキーワードで分類された記事を表示させたい人もいらっしゃると思いますので、その方法も掲載しておきます。　タグキーワードを利用してフィルタリングする場合も<MTTagInvoke>を利用します。

タグでフィルタリングする場合は、<MTEntries>の箇所でtags=”記事タグ1 OR 記事タグ2 OR …” のように、記事本文のタグを「 OR 」で区切ってtagsアトリビュートに指定する必要があります。　これを<MTTagInvoke>を使って生成すればOKです。

<ul>
<MTTagInvoke tag_name="MTEntries">
<MTEntryIfTagged>
<MTTagInvokeAttribute name="tags">
<MTEntryTags glue=" OR "><$MTTagName$></MTEntryTags>
</MTTagInvokeAttribute>
<MTTagInvokeAttribute name="lastn">5</MTTagInvokeAttribute>
<MTTagInvokeContent>
<li><a href="<$MTEntryPermalink$>" title="<$MTEntryTitle$>"><$MTEntryTitle$></a></li>
</MTTagInvokeContent>
</MTEntryIfTagged>
</MTTagInvoke>
</ul>

さりげなく<MTEntryIfTagged>が使われていますが、これで挟まないとタグ付けしていない記事同士でも関連記事に出てきてしまいますので、必ず記述しておきましょう。

現在表示されている記事を関連記事リストから除外する

ここで1つ問題が起こります。　それは「現在表示されている記事自身も関連記事に表示されてしまう」ということです。　自分自身はもう表示されているわけですから、当然除外しないといけません。

そこで登場するのが2番目のプラグイン「Compare Plugin for MovableType」です。　このプラグインを使うと、MTタグ内でいわゆる「if文」のような表現が使えます。　MovableType4になって<MTIf>というタグが登場しましたが、MovableType3.xまでは貧弱な分岐タグしかありません。

このプラグインでサポートされる<MTIfNotEqual>タグと、前述のMTInvokeプラグイン、<MTSetVar>タグ、<MTGetVar>タグを組み合わせることで、自分自身の記事リンクをリストからを取り除くことができます。　それではやってみましょう。

まず、表示されている個別記事自身のエントリーIDを<MTSetVar>でbaseEntryIDとでも名前をつけて変数に入れておきます。　エントリー記事本文が表示される直前にでも書いておくと良いでしょう。

<MTTagInvoke tag_name="MTSetVar">
<MTTagInvokeAttribute name="name">baseEntryID</MTTagInvokeAttribute>
<MTTagInvokeAttribute name="value"><$MTEntryID$></MTTagInvokeAttribute>
</MTTagInvoke>

次に、関連記事を表示させる箇所で<MTIfNotEqual>を使って、関連記事のエントリーIDと先ほど記憶しておいたbaseEntryIDとを比較して、異なっていたら関連記事として表示されるようにします。

<h2>関連記事</h2>
<ul>
<MTTagInvoke tag_name="MTEntries">
<MTTagInvokeAttribute name="category"><$MTEntryCategory$></MTTagInvokeAttribute>
<MTTagInvokeAttribute name="lastn">5</MTTagInvokeAttribute>
<MTTagInvokeContent>
<MTIfNotEqual a="[MTGetVar name='baseEntryID']" b="[MTEntryID]">
<li><a href="<$MTEntryPermalink$>" title="<$MTEntryTitle$>"><$MTEntryTitle$></a></li>
</MTIfNotEqual>
</MTTagInvokeContent>
</MTTagInvoke>
</ul>

これで完成です。　最新記事からリストアップされていきますので、古いエントリーを出したりランダムに出すにはもう一工夫必要かもしれませんが、これで滞在時間もアップしてくれるのではないでしょうか。

このページをシェアする

2008-03-24