pagetop

>このブログのトップ

テンプレートデザインを楽に作成するコツ

2004-06-25

【テンプレートデザインを楽に作成するコツ】

ディレクトリ構成は先ほど説明したような形になっていますが…
blogtmp/blogtop.html
から
css/user.css
を参照するときのblogtop.htmlに記述される相対パスは

<link href="./css/user.css" rel="stylesheet" type="text/css">

となります。

これはCGIでblogtmp/blogtop.htmlファイルを読み込んで吐き出す先がblogtmpフォルダの上、つまりbasicフォルダの直下になるからなのです。
blogtop.htmlファイルはblogtmpフォルダの中に入っているけど実は「入っていない」のです。
※ ちょっとややこしいですが…

画像を参照したい場合も同じです。
html/images/test.gif
の画像をblogtmp/blogtop.htmlで使用したい場合の相対パスは…

<img src="./html/images/test.gif">

となるのです。

HTML編集ソフトを使ってテンプレートファイルを作成する場合は

basic - blogtop.html [blogtmp]
   - ubc.html [blogtmp]
   - monthly.html [blogtmp]
   - form.html [blogtmp]
   - comment.html [blogtmp]
   - monthly_body.html [blogtmp]
   - trackback.html
   - trackback2.html
   - search.html [html]
   - error.html
   - css
   - html
    - images
   - pluginhtml
   - basic.jpg
   - basic_s.jpg
   - info.txt
※ [ ]内はもともとのフォルダ名

としてからデザインしましょう。


【デザイン終了後】

ファイルを元の位置に戻します。
元に戻した後はリンクがおかしくなるのでブラウザの表示がおかしくなりますが…そのままにしておいてください。

※ HTML編集ソフトを使って作業する人は必ずソフトを閉じてローカルで作業しましょう!
最近のHTML編集ソフトはエライのでリンクを勝手に修正しちゃったりします。
せっかくの作業が水の泡です。
やっちゃった人は泣いてください。

Posted by admin 11:12:49 │Comments(0)TrackBack(0)

http://www.pwblog.com/pwblogdesign/cwtb.cgi/357

名前
メール
URL
コメント

▲ページの先頭へ