試験運用中なLinux備忘録・旧記事

はてなダイアリーで公開していた2007年5月-2015年3月の記事を保存しています。

DocBook XML文書をスタイルシート(CSS)を使用してWebブラウザ上で表示

DocBook文書は、そのままでは単なる構造の記述で、変換をかけないと、見やすい形で確認することはできないが、XML版では、wysiwygdocbookというCSS形式のスタイルシートを使用することで、WebブラウザからXMLファイルを開くだけで、ドキュメントの内容を分かりやすく見ることができ、プレビューという使い方でも十分に有用。多少見栄えに不満があっても、ある程度のカスタマイズもできる。画像が現状ではうまく表示されなかったりと、制約もある(表示するためのコードらしきものはあるのだが...)。

wysiwygdocbookの入手

リリース版は以下のURLから入手できる。
http://www.informatik.fh-wiesbaden.de/~werntges/proj/wysiwyg-dbk01.html
開発版は、

$ svn co http://joomlacode.org/svn/docbookcollab/trunk/css --username anonymous --password \n

を実行することで、css/ディレクトリ以下にファイルがダウンロードされる。

DocBook XMLファイルにCSSの記述を追加

DobBook XMLファイルの中(「article」などの最上位要素のタグの上の行辺り)に、次のようにdriver.cssの場所を指定する。

<?xml-stylesheet href="[driver.cssの場所]" type="text/css"?>

これで、Webブラウザからこのファイルを開いたときに、CSSにより、分かりやすい表示で見ることができるようになる。

カスタマイズ

http://www.informatik.fh-wiesbaden.de/~werntges/proj/wysiwyg-dbk01.html
の「Customization」にあるように、driver.cssをimportして、後ろに追記する

@import "driver.css";
(以下、追加や上書きしたい設定をCSSのルールで記述する)

このような形の.cssファイルを作成し、driver.cssのあるディレクトリに置き(custom.cssとする)、そのファイル名を

<?xml-stylesheet href="[custom.cssの場所]" type="text/css"?>

のように指定することにより、(CSSの書き方が分かっていれば)見栄えを自由にカスタマイズできる。

キーワードの日本語表示

「Warning」などのキーワードが英語で表記されている部分は、多言語化に対応していて、日本語に対応させることもできる。
l10n/ディレクトリのen.cssja.cssという名前でコピーし、そのja.cssを開いて、「content:」の値の文字列部分を日本語に変更していく。

warning:before {
	content: "警告: ";
}

上は例として、「Warning」の部分を「警告」にした状態。このような要領でキーワードを日本語にしていったら、このファイルを読み込めるようにl10n.cssを修正する。

--- l10n.css.orig
+++ l10n.css
@@ -23,3 +23,4 @@
 @import "l10n/pl.css";
 @import "l10n/de.css";
 @import "l10n/es.css";
+@import "l10n/ja.css";