標準flavourの使い方flavourを導入するflavourを作ってみるはてなダイアリー形式flavourの作成flavourの構成content_typeheaddatestoryfootflavour完成あとがき著者について書いた人:ふしはらかんはじめに「lilyでブログカスタマイズ第1回」では、lilyの導入と基本的な記事の投稿方法を解説しました。ブログをカスタマイズするとして、まず思い浮かぶのはデザイン面ではないでしょうか。lilyの場合、折角サーバーを借りて運用するわけですから、ブログホスティングサービスでは出来無い全面的なデザインカスタマイズをしてみたいところです。CGIが結果出力を行う場合、プログラムの中に逐一出力処理を記述していく方法と、テンプレートと呼ばれる仕組みを使う場合の2種類があります。テンプレートとは、予めどの状況でも変化しない部分(ブログならば、タイトルやサイドバー)を1つ、あるいは複数のファイルに記述しためのです。CGIの実行時に特定の部分(ブログの場合は記事そのもの)を置き換えて出力します。lilyではこのテンプレート方式の一種である、flavour(フレーバー)という仕組みでHTMLを出力します。flavourはHTMLだけでなくRSSファイルなど他のフォーマットのファイルを出力するためにも利用できます。flavourとは?URLと表示内容の対応flavourの詳細について説明する前に、lilyがどのようにして出力する画面を決定しているかの仕組みを説明します。以下のように直接lily.cgiにアクセスすると、最近投稿した記事を何件か表示します(このときの件数はlily.cfgで設定します=>第1回)。http://www.mikihoshi.com/rubima/d/lily.cgi特定の日付の記事を表示することも出来ます。全ての記事の中から今年投稿された記事のみを表示する場合はhttp://www.mikihoshi.com/rubima/d/lily.cgi/2004というURLにアクセスします。今月のみにしぼるならhttp://www.mikihoshi.com/rubima/d/lily.cgi/2004/12クリスマスイブの悲痛な記事のみを表示する場合はhttp://www.mikihoshi.com/rubima/d/lily.cgi/2004/12/24というURLにアクセスすることになります。最後のURLにはもうひとつのパターンがあります。http://www.mikihoshi.com/rubima/d/lily.cgi/test/xmas.html/2004/12/24/そして、拡張子の「html」にも意味があります。先程のURLを以下のように変えてアクセスしても、ページのデザインは変りますが、記事自体は正しく表示されます。2http://www.mikihoshi.com/rubima/d/lily.cgi/test/xmas.flav/2004/12/24/lilyでは、lily.cgiに続けてディレクトリとファイル名(xmas)で記事のファイル名を指定して表示することも出来ます。特例として、ファイル名が「index」の場合は、条件を満たす全ての記事を表示します(ファイル名を指定しない場合も同様です)。ファイル名に続けてディレクトリを指定することで記事の時刻を限定することもできるのです。拡張子はどのflavourを使って表示するかを決めているます。ちなみに、URLで明示的にflavourを指定しない場合は、lily.cfgで定義したデフォルトflavourが使用されます。標準flavourの使い方lilyの標準セットでは、3種類のflavourを使っています。1つ目は、トップページ用のflavourです。コメントやトラックバック、リファラの表示が簡易版になって、サイドメニューに「最近の記事」や「最近のコメント・トラックバック」の一覧などが表示されます。(例)2つ目は各記事の詳細ページ用のflavourです。コメントやトラックバックの詳細が表示され、コメント入力欄も表示されます。トップページ用のflavourの中で、各記事のPermalink(固有リンク)を、この詳細ページ用flavourを使うURLにしてあります。3つ目はRSSを表示するためのflavourです(例)。flavourはHTML専用というわけではなく、使い方次第でRSSなど他のフォーマットのドキュメント出力にも使えます。その気があればPostScriptなどで出力したりも出来るはずです。これらのflavourは、lily.cgiと同じディレクトリにあるflavourサブディレクトリに入っています。ディレクトリ内を見ると、拡張子flav,html,rdfの各ファイルが存在しているのが分かると思います。後述しますが、flavourはcontent_type.*head.*date.*story.*foot.*の5つのファイルで構成されています(いくつかのファイルは存在しない場合もあります。「*」にはflavour名(flav,htmlなど)が入ります)。従って、これらのファイルを入れ替え、あるいは追加すれば、違うflavourを使うことが出来るわけです。flavourを導入する標準flavourの説明が済んだので、それ以外のflavourを導入する方法を解説します。「ブログカスタマイズ」ですので、直ぐにでもflavourを自作してみたいところですが、その前に既存のflavourを導入してみることで、flavourを扱う練習をしたいと思います。lilyはperlで書かれたblosxomというツールをrubyに移植したものなので、blosxom用のfalvourがほとんどそのまま使えます。そこで、blosxom用flavourの配布ページからいくつかflavourを導入します。flavour」(moleskin氏作成)を使う方法を解説します。パッケージをダウンロードします。パッケージを解凍すると、flavourファイルとCSSファイルが入っています。head.html中でCSSのURLを指定している部分を、自サイトのURLに変更します自分のサーバのflavourディレクトリにアップロードします本当はサイドバーの内容なども変更すべきですが、今回は使うための最小限の手順を解説しました。して導入したflavourを使った表示は、以下のURLで確認できます。(今回は、既存のflavourとの共存のためにflavourファイルの拡張子(flavour名)をhtmlからscに変更しました)http://www.mikihoshi.com/rubima/d/lily.cgi/index.scもう一つ、tDiary互換flavourを試してみます。http://cgi.no-ip.org/cgi-bin/blosxom/data/でblosxomのデータディレクトリを公開されているのですが、flavourディレクトリ内に拡張子tdiaryのflavourファイルがあるので、ダウンロードします。tDiary互換flavourの場合はプラグインに関する記述など、変更の必要な箇所がいくつか存在します。変更したものをアップしておきます。(tdiary.zip)自分のサーバのflavourディレクトリにアップロードしますtDiary互換flavourの導入はやや複雑ですが、tDiaryの豊富なテーマを利用することが出来ます。今回はおなじみのcloverテーマを導入してみました。http://www.mikihoshi.com/rubima/d/lily.cgi/index.tdiaryプログラムやHTMLに詳しくない人は、こうした既存のflavourを適用しつつ、少しずつ中身を書き換えてカスタマイズするのがお奨めです。flavourを作ってみるはてなダイアリー形式flavourの作成それではいよいよflavourを自作します。今回は、はてなダイアリーにインポートできる「はてなの日記データ形式」XMLファイルを出力するflavourを作ってみます。はてなの日記データ形式を選んだのは構造がシンプルだからですが、実際にこのflavourを使ってlilyのblogをはてなにエクスポートし、はてなダイアリーブックサービスで本にする、などの利用法もあります3。はてなダイアリー形式のXMLファイルは、以下のような構造になっています。</day></diary>それでは、flavourの仕組みを説明しながら、実際にはてなの日記データ形式flavourを作っていきます。foot)は以下の順序で組み合わさって出力されます。各flavourファイルを順番に説明して行きます。content_typeこのflavourは特殊で、HTTPヘッダの「Content-type」フィールドを指定するものです。今回作成するはてなデータ形式や、RSSのファイル等はXMLファイルです。そのため、ブラウザで正しく処理するには「Content-type」フィールドにXMLを意味する「text/xml」を出力する必要があります。flavourファイルが存在しない場合、lilyは自動的にHTML用のContent-typeフィールドを出力します。flavourは不要です。head出力の先頭で1回だけ表示されるflavourです。HTML形式のflavourの場合、<html>から始まり、<head>〜</head>の記述、body部の記事表示前のタイトルや注意書き表示の部分を記述します。ちなみに、lilyの現行のデフォルトflavourではこの部分にサイドメニューの項目も記述していますが、アクセシビリティの観点から余り良くありません(携帯電話などの画面の小さい端末の場合、スクロールしないと記事本文が登場しない)。flavourに記述することをお奨めします。headに限りませんが、各flavour内では、lily.cfgに定義した値や、プラグインの特殊な出力を記述することが出来ます。<h1>$blog_title</h1>と記述すると、lily実行時には、lily.cfgで定義したblog_title(ブログのタイトル)に置換されます。例のようにH1で囲って文章の見出しに使ったりすることができます。それ以外もlily.cfgで定義している値は$定義名のように書くことで出力できます。単純な定義だけでなく、月別のアーカイブリンクを出力したり、カテゴリ別のリンクを出力したりする場合は、プラグインという仕組みを使います。storyの各flavourは、表示する記事の回数分表示されます。flavourは各日の最初だけ出力されます。2004年12月の記事を表示する際、12月1日の記事が2つ、12月3日の記事が1つだとすると、12/3分のdate12/3の記事のstory12/1分のdate12/1の記事のstory(その1)12/1の記事のstory(その2)のように出力されます。flavourの中では、以下の記述が、記事の投稿日時に置換されます。秒(00-59)例えば、「2004年12月24日」のような表記を行う場合は、$yr年$mo_num月$da日と記述します。はてなデータ形式では日付を意味する<day>と<body>を記述することになります。flavourは各日の最初だけしか表示されないということです。そのため、<day>,<body>の前に</body>,</day>を追加して、直前の日の要素を閉じています。flavour(前の日がない)のためのダミーです。storystoryでは、各記事の表示の仕方を記述することになります。その為、storyでは今までに説明した、$を使ってlily.cfgに定義した値を表示する記事の投稿時刻を表示する以外に、以下の特殊な表記を使うことが出来ます。blogの各記事には、その記事へリンクを貼る際にPermalinkが示してあると便利ですが、$url(lilyの設置されているURL)という表記を使うことで、以下のように記述できます。href="$url$path/$fn.$flavour">permalink</a>$flavourの部分は「html」などのflavour名を入れてしまってもいいと思います。はてなの日記データ形式の場合、1日の日記の中の記事のまとまり(セクション)ごとに、*[カテゴリ]見出しのようにタイトルを付けるので、story.hatenaは以下のようになります。footfootは記事の表示が終わったあと、最後に出力されます。はてな日記データ形式の場合は、タグを閉じるだけですね。○○」とツール名が表記されています。Ruby」と、Rubyへのリンクを入れているものが多いです(中にはテンプレートエンジンのリンクなんかも入っていたり)。筆者はなんとなくこのRuby式の表記を気に入っていたりします。flavourを置いておきます。(hatena.zip)また、これをサンプルのlilyに適用した場合、以下のようなXMLになります。http://www.mikihoshi.com/rubima/d/lily.cgi/index.hatenaあとがき今回はflavourについて説明しましたが、いかがでしたでしょうか。書き終えてから「今回はほとんどRubyと関係ない」というるびまの連載として致命的な欠陥に気が付いたのですが、本連載の肝と言っても良い次回の「プラグイン解説」のためには不可欠な箇所ですので、ご容赦いただければと思います。今回説明したflavourの仕組みを、lilyでどのように実現しているか興味のある方は是非lily.cgiのソースをご覧下さい。難しいことはやっていませんし、分量も少ないのでソース読みの練習材料として適材ではないかと思います。分かり辛い箇所があれば、著者までフィードバックしていただけば是非次回の内容に活かしたいと思います。著者についてなまえ:ふしはらかん。http://www.mikihoshi.com/d/にて日記を書いてます。最近はlilyよりもwema2の開発に忙しかったり...。http://www.mikihoshi.com/wema2/test/もちろん、大幅に機能強化したlily2も構想中なので、期待せずお待ち下さい。ここで述べている記事の日付は、ファイルが作成された日付(通常はFTPでアップロードされた日付)です。作者としては「はてなへの移行が簡単」とは言いたくないです。