私的アンテナTYPE-F(赤は48時間以内に更新されたコンテンツ)
<|日々の戯言アニメコミックゲーム美少女系ゲームフィギュアドール全般しーぽんちっちゃなもこちゃんえっくす☆きゅーとアキバ系りとらばU-10BLOGネットネタこのサイトについて|>

2006年02月10日 (金曜日)

[ BLOG ]

MTでRingBlog風の最新記事表示

きっかけは某エロゲ関連サイトのBlog(*´Д`)だったりしますが、今回以前から導入したかった「RingBlog」のWHAT NEW表示をMovableTypeに取り入れてみました。

本物と違うのはページ処理がない点で、インデックス内の移動が出来ません。
まあそこまでやる気もなかったので、その機能は無視していますヽ(´ー`)ノ
あくまで「RingBlog」風に真似出来ればOK、というコンセプトでやっていますので。

ちなみに手順的には、最新記事一覧テンプレートをデザインし直しただけで、大したことはやっていません。
一部Pluginも使ってはいますが、恥ずかしいのでMT上級者の方は読まないでください(^^;

そんなわけで、一応テンプレートを置いときます。(classは適当に変更してください)

<div class="blog">
<h3 class="date">最新記事一覧</h3>
<div class="blogbody">
<MTEntries>
<div class="index_body">
 ■<$MTEntryDate format="%m/%d(%a) %H:%M"$>
<MTIfMatches var="EntryKeywords" pattern="m|^http://.*\.jpg$|i">
 <a href="#<$MTEntryID pad="1"$>" title="<$MTEntryTitle$>"><img class="image_index" src="<$MTEntryKeywords$>" title="<$MTEntryTitle$>" alt="<$MTEntryTitle$>"></a>
</MTIfMatches>
<MTIfNotMatches var="EntryKeywords" pattern="m|^http://.*\.jpg$|i">
 <img class="image_index" src="<$MTBlogURL$>images/blank.gif">
</MTIfNotMatches>
 <a href="#<$MTEntryID pad="1"$>" title="<$MTEntryTitle$>"><$MTEntryTitle trimj_to="70"$></a>
<div style="text-align: right;">
[ <MTEntryCategories glue=", "><a href="<$MTCategoryArchiveLink$>"><$MTCategoryDescription$></a></MTEntryCategories> ]
</div>
</div>
<div class="index_underline"></div>
</MTEntries>
</div>
</div>
#MovableType Ver3.171-jaで動作確認

ざっと解説。
イメージアイコンの表示ですが、本家の「RingBlog」では個別エントリ内の画像と同期が取れており、そのイメージURLを引っ張ってきているようです。
ですが、本サイトは個別エントリと画像URLとの関連性がありません。
そこでエントリの概要キーワードにイメージURLを埋め込み、「Regex Plugin」(Brad Choate作)を利用して、それを参照する方式を採用しました。

ちなみに本来は画像URLをエントリーがら正規表現で抜き出し、その参照文字列をURLとして利用する方がスマートです。
ですが、Regex Pluginでは、Perl同様の後方参照の値を外に持ち出すことが出来ませんでした。
その為この方式に落ち着いたわけです。まあ好きな画像が張れるメリットもあるので、いいかということで(^^;
処理的には<MTIfMatches>、<MTIfNotMatches>の正規表現判定で、概要キーワードにイメージタグが含まれていたら、そのURLを展開、なければダミー画像を、というようなことを行っています。

次にEntryTitleタグで呼んでいる「trimj_to」ですが、「日本語対応トリミングフィルタ」(人生迷い箸さん作)というPluginで、長いタイトルの回り込み防止に入れています。
本来MT3.171にも標準で「trim_to」という同機能があるのですが、本サイトのPerlのバージョンの関係か、UTF8だと文字化けを起こす時もあるので、こちらを利用させてもらっています。

そういうわけで、これをIndexTemplateの頭の方に入れ、CSSに関連classを追加すれば作業は完了です。
後は更にカッコよくデザインするなり、好きにしてください(って今時こんなことやる人いないでしょうけど)

・2006/03/14【追記・訂正】
 トラックバック時に概要記載があれば、本文より概要を優先して送信する仕様を考慮していませんでした(^^;
 ということで、アイコン画像を概要(MTEntryExcept)からキーワード(MTEntryKeywords)に変更しました。
 某有名どころにトラバして、イメージURLの概要を残して気付きました(笑)
 
【関連するリンク】
RingBlog
アールエスケイのBLOG (RSK)

トラックバック
このエントリーのトラックバックURL:

スパム対策の為、トラックバック元URLに本Blogへのリンクを含まない場合、トラックバックを受け付けない仕様になっています。また、Blogやそれに順ずるシステム以外からのトラックバックも受け付けません。予めご了承ください。
なお、お手数ですがトラックバックURLより「☆★」を取り除いてください(オートディスカバリ非対応です)
コメント
コメントする






情報を保存しますか?


画像の数字を入力