小粋空間  -  a cheap joke and a play on words site

エントリーの画像をサイドメニューに表示

エントリーに携帯等で撮った画像を表示しているブログをよく見かけますが、エントリーの画像を検索してサイドバーに自動的に表示するカスタマイズをご紹介致します。具体的な動作は、エントリーの中に書かれている img 要素の src 属性を検索し、そこで指定された画像をサイドバーに表示します。Collect プラグインというものを利用しています。
以下、手順メモです。

１．プラグインのダウンロード

Collect Plugin for Movable Type の Collect より Plugin をクリックします（ソースが表示される場合は右クリックして「対象をファイルに保存」を選択）。

２．プラグインのアップロード

ダウンロードした Collect.pl を plugins ディレクトリ直下にアップロードします。

３．テンプレート修正

リスト１のタグを、画像を表示したいテンプレート（メインページ／カテゴリーアーカイブ／日付アーカイブ／個別エントリーアーカイブ等）のサイドバー部分に追加します。次のタグは最近の8エントリーより、各エントリー内にある一番最初のイメージを表示します。

<MTEntries lastn="8">
<MTCollect tags="img">
<MTCollectThis show="0">
<$MTEntryBody$>
</MTCollectThis>
<MTIfCollected tags="img">
<MTCollected tags="img" lastn="1">
<a href="<$MTEntryLink$>">
<img src="<$MTCollectedAttr attr="src"$>" style="margin:10px" />
</a><br />
</MTCollected>
</MTIfCollected>
</MTCollect>
</MTEntries>

リスト１：最近の8エントリーより各エントリー内にある一番最初のイメージを表示

リスト２のタグは、全エントリーから最新の5個のイメージを表示します。

<MTCollect tags="img">
<MTEntries lastn="5">
<MTCollectThis>
<$MTEntryBody$>
<$MTEntryMore$>
</MTCollectThis>
</MTEntries>
<MTIfCollected>
Recent Photos of all <$MTCollectedTotalCount$> photos<br />
<MTCollected tags="img" lastn="5">
<img width="100" src="<$MTCollectedAttr attr="src"$>" alt="<$MTCollectedAttr attr="alt"$>"<$MTCollectedContent$><br />
</MTCollected>
<MTElse>
No Photos
</MTElse>
</MTIfCollected>
</MTCollect>

リスト２：全エントリーから最新の5個のイメージを表示

以上です。なおこの機能については以下のサイトを参考にさせて頂きました（テンプレートもそこからの抜粋です）。

• bird.dip.jp
• Sync A World You Want To Explore

あとはカメラ付き携帯を買うだけ（爆）。

2005.08.08 追記
本文を全面修正しました。

2006.09.10 追記
マークアップ修正。