このブログでのお知らせが遅くなりましたが、先日、Movable Type で関連記事を表示するプラグイン「SimilarEntries」をリリースしました。

今日は SimilarEntries プラグインの特徴をご紹介します。

複数のフィールドで関連性を判定

Movable Type のデフォルトの機能を使って関連記事を表示する場合、「同じタグが付けられている記事」や「同じカテゴリに属する記事」をリストアップすることが多いですが、当プラグインは、複数のフィールドで関連性を判定することができます。

カスタムフィールドも関連性の判定に含めることができます。

フィールドごとに優先度を設定可能

フィールドごとに優先度を変えることができるので、例えば、

• タグが一致していれば +3 点
• キーワードが一致していれば +2 点
• カテゴリが一致していれば +1 点

といった設定が可能です。これらの点数を積み上げていき、点数の多い記事から順にリストアップしていきます。

JavaScript で動的に表示

このプラグインでは、JavaScript で動的に関連記事を表示します。

まず、インデックステンプレートで関連付けを判定するための専用フォーマットの JSON を、スタティックパブリッシングで書き出します。JSON を書き出すと言っても、下記のようなファンクションタグをインデックステンプレートに書けばOKです。

<mt:SimilarEntriesRelateJSON
 include_blogs="7"
 fields="tags,keywords,field.text01,category">

これだけ書けば、あとはファンクションタグがよしなにやってくれます。

次に、同じくインデックステンプレートで出力 HTML 用の JSON ファイルをスタティックパブリッシングで書き出します。これも、下記のようにブロックタグ内に出力したい情報の MTML を書けばOKです。

<mt:SimilarEntriesTemplateJSON include_blogs="7">
<li><a href="<mt:EntryPermalink>"><mt:EntryTitle></a>（<mt:BlogName>）［<mt:EntryPrimaryCategory><mt:CategoryLabel></mt:EntryPrimaryCategory>］</li>
</mt:SimilarEntriesTemplateJSON>

これで、

{
 e718: "<li><a href="/SimilarEntries/archives/000718.html">すべてのページで同じ「最近のブログ記事一覧」を表示するカスタマイズ</a>（SimilarEntries）［MT Customize］</li>",
 e725: "<li><a href="/SimilarEntries/archives/000725.html">一定時間で自動的に消える New マークを付ける JavaScript の jQuery 版</a>（SimilarEntries）［JavaScript］</li>",
 （省略）
}

のような JSON を書き出してくれます。

あとは、出力したい場所（記事のテンプレートなど）に、

<mt:SimilarEntriesShow
 fields="tags,keywords,field.text01,category"
 relation_url="http://your-host/SimilarEntries/relation.json"
 template_url="http://your-host/SimilarEntries/template.json"
 target_selector="#similar-entries"
 limit="5">

と書けば、実行する部分の JavaScript を書き出してくれます。

使い方の詳細は、mt-plugin-SimilarEntries/README.md at master · bit-part/mt-plugin-SimilarEntries をご覧ください。

流れとしては、

1. 関連付けを判定するための JSON を Ajax で読み込み
2. 関連記事の ID を取得
3. 出力用の JSON を Ajax で読み込み
4. 該当する ID の情報を出力

するとこになります。

jQuery 等のライブラリは使っていないので、jQuery を使ったサイトでも AngularJS を使ったサイトでも、どんなサイトでも利用することが可能です。

JavaScript での処理がメインのプラグインですが、基本的に JavaScript は書かなくても利用できます。

また、関連記事をリストアップするループで毎回呼ばれる関数を JavaScript で設定することもできるので、少し JavaScript が書ければさらにきめ細かい制御が可能となります。

下記に、

• 最初の１回にはさみたい HTML を指定
• 最後の１回にはさみたい HTML を指定
• 偶数回目に呼ばれる処理を指定
• 奇数回目に呼ばれる処理を指定
• 3回ごとに呼ばれる処理を指定

した例を掲載します。

<mt:SetVarBlock name="first"><ul></mt:SetVarBlock>
<mt:SetVarBlock name="last"></ul></mt:SetVarBlock>
<mt:SetVarBlock name="each_function">
function(i, text, odd, even){
 if (odd) {
 text = text.replace(/<li/, '<li class="odd"');
 }
 else if (even) {
 text = text.replace(/<li/, '<li class="even"');
 }
 if (i % 3 == 0) {
 text += '</ul><ul>'
 }
 return text;
}
</mt:SetVarBlock>

<mt:SimilarEntriesShow
 fields="tags,keywords,field.text01,category"
 relation_url="http://your-host/SimilarEntries/relation.json"
 template_url="http://your-host/SimilarEntries/template.json"
 target_selector="#similar-entries"
 limit="5"
 first="$first"
 last="$last"
 each_function="$each_function">
</div>

以上です。商用利用は有料となりますが、皆様のお役に立てば幸いです。

• bit-part/mt-plugin-SimilarEntries