ゴミ箱.net

汚物は消毒

[webgen]相対パスの指定

このページの情報はwebgen 1.4.0をもとにしています。

階層化されたウェブサイトにおいてCSSのスタイルシートや画像のファイルを含める場合、そのパスの指定は少し厄介である。
例として、以下のような階層構造を持つウェブサイトを構築する。
├─css
│ └─style.css
├─index.html
└─sub1
  └─sub1.html

ここでindex.htmlとsub1/sub1.htmlに共通のテンプレートを適用し、その中で外部CSSとしてファイルcss/style.cssを参照したい。そのときパスの指定はどうするのがいいだろうか。
テンプレートファイル内で<link rel="stylesheet" type="text/css" href="css/style.css" />のように指定したら、index.htmlからはきちんと参照できるが、sub1/sub1.htmlからは参照できない。なぜならsub1/sub1.htmlからの相対パスは../css/style.cssとなるからだ。

では<link rel="stylesheet" type="text/css" href="../css/style.css" />と指定したらどうか?sub1/sub1.htmlからは参照できるが、今度はindex.htmlから参照できなくなってしまう。

それならば絶対パスで<ink rel="stylesheet" type="text/css" href="/css/style.css" />と指定したらどうか?
このウェブサイトがウェブサーバのトップ階層にあるならこれでどちらのページからも参照できる。しかしウェブサイトがトップ以外の階層に配置されたとたん動作しなくなる。
そもそもローカルで参照できないので動作確認もままならない。

その場合、webgenのタグrelocatableを用いることで、webgenのソースフォルダsrcを起点とした絶対パスを、個々のHTMLファイルからの相対パスに変換することができる。
上記の例では、 <link rel="stylesheet" type="text/css" href="{relocatable: /css/style.css}" />のように記述すればよい。
このタグは、index.htmlから参照されたときはcss/style.css、sub1/sub1.htmlから参照されたときは../css/style.cssに変換される。
スポンサーサイト

PageTop

コメント


管理者にだけ表示を許可する