以前、そのままでは味気ない RSS フィードに CSS によってスタイルを定義し、すこしでもユーザーフレンドリーな RSS へというエントリーを書きましたが、今回は前回よりももっと本格的に RSS をカスタマイズするため 「XSLT」 を使用した RSS フィードの XHTML 変換に挑戦してみることにします。
RSS1.0 フィードを XSLT と CSS によって FeedBurner ライクな見た目に変更する感じで。
今回制作した XSLT はこちら
MovableType で生成した RSS1.0 に上の XSL ファイルを適用。XHTML への変換をした上で CSS をあててやればブラウザ上では通常のウェブページと同じように表示させることができます。ただし XSLT による XHTML 変換時に必要な XSLT プロセッサはブラウザに依存するので表示できるブラウザが多少限られます。とはいえ、IE なら 6.0 以降、Firefox や Netscape8 など最新のブラウザであれば問題なく表示できるので大丈夫でしょう。
今回ちょっと手間取ったのはエントリーの本文を出力する際、本文に含まれる HTML タグをエスケープせずに出力させたいと思って disable-output-escaping 属性をエスケープ無効と指定しても、Mozilla 系ブラウザの XSLT プロセッサでは CDATA セクションに対するエスケープ無効は無視されるというところ。まあ、XSLT 的には正しい挙動なのかもしれないけど......
で、今回はエスケープ無効を無視するブラウザに対しては Javascript によって強制的にエスケープ解除をかけるという裏技で対処してみることに。ありがたいことに Sean M. Burke 氏制作の Javascript がパブリックドメインにて公開されているので、これをちょこっとだけ改造して利用させてもらいました。
CSS での見た目のカスタマイズの際も書きましたが、RSS フィード自体がブラウザで直接見てどうこうというようなものでもないので、見た目を変えたからなんですかといわれればそれまでですが、そこはユーザーに優しい RSS のためということで。古いブラウザ使っている人にはさっぱり優しくないですけど......
せっかくなんで今回作ったファイルをまとめて上げときました。興味があればどうぞ。ちなみに、Windows環境で、ブラウザは Firefox1.04、IE6 での確認はしています。
- Download : xsl_sample.zip (19.5 KB)