Blogの最新記事一覧を単純な方法でBlog外のページに表示させる

最近サイトの一コンテンツとしてBlogを制作することが多い。
中には角度の高いクライアントもいて、Blog(MTプログラムが生成するページ群)外の静的ページ(DW等で通常つくるページ、HOME等)にBlogの最新記事一覧を掲出したいという相談も受けるんですねぇ。

想定しているのを図にするとこんな感じ。

で、それについてちょっと悩んでいたわけなのですよ…。

RSSを二次利用したらどうか？

ブログポータルやブログ向けサービスなどではお馴染みの、RSSをJavascriptで読み込めるようにプログラムを通すことも検討してみました。例えば大黒屋本舗さんの「jsRSS++」。

RSSを読み込んでページに埋め込むJavaScriptを生成するCGI。だけどテスト環境ではうまいこと動かず断念。外部のフリーサービスを使うのも心苦しいのでそのときは完全見送りになっていたのです。

寝ぼけてたら降ってきたネタ

何で今朝このことについて考えていたのかが全くもって不明なのですが(完全寝ぼけ状態)、空の向こうから紙がヒラヒラ…ひらひらと舞い降りてきて思いついたのが、以下のネタ。

簡単に言うと、サイドバーに掲出する最新記事一覧のように、同様のものを外部JSファイルに落とし込むというもの。新規投稿時にこのファイルも再構築するようにしておくので、サイトHOMEにはクライアントの手間をかけずに最新情報が掲出できるわけです。

1. テンプレート(インデックス)でテンプレートを新規に作成
   テンプレート名は任意、出力ファイル名は「hoge.js」とつける

2. テンプレートの内容は以下のように記述。nは表示させたいエントリー数。

   document.write("<ul>");
   <MTEntries lastn="n">
   document.write("<li><a href='<$MTEntryPermalink$>'><$MTEntryTitle$></a></li>")
   </MTEntries>
   document.write("</ul>");
   

3. 「インデックス・テンプレートを再構築するときに、このテンプレートを自動的に再構築する」のチェックはオンのままにし、保存・再構築
4. 出来上がったJSファイルを一覧掲出したいHTMLファイルにリンクさせる

※ファイルの生成は上記の通りですが、文字化けを回避するため、JSファイルを埋め込む側のHTMLファイルの文字コード、CharacterSetをMTで使用の文字コードに(UTF-8等)に揃える必要があります。

後はID等を追加し、CSSで装飾すれば完成。

以下の環境下での動作を確認をしています。
(ただのdocument.writeなので、大抵動くと思いますが…)

Win → IE5.x～、Firefox、Mozilla、Opera8、Netscape7
Mac → Safari、Firefox,Opera,Camino、IE5.2、Netscape7

RSSを二次利用してやらなきゃと頭でっかちで考えちゃってましたね。
しかしまあ、あまりにも単純な方法なので、どこかで既出かもしれませんが…。