TSNETWiki

• Prev
• Next
• ねこ丸

TSNETWiki のベーススキンを作りました。ベーススキンを利用するためのメモ書きを並べてありますが、現在の TSNETWiki のスキンとは異なる部分もあるので、そのまま当てはまるわけではありません。

すでに obsolete な感じです。

修正の必要なプラグイン

navi

印刷のときに navi プラグインの出力を display: none で隠している。このために以下の部分の修正が必要。

	if ($footer) // フッタ
	{
		$ret = <<<EOD
<div class="navi_footer"> <!-- ここと -->
<hr class="full_hr" />
<ul class="navi">
<li class="navi_left">{$navi[$home]['prev1']}<br />{$navi[$home]['prev']}</li>
<li class="navi_right">{$navi[$home]['next1']}<br />{$navi[$home]['next']}</li>
<li class="navi_none">{$navi[$home]['home1']}<br />{$navi[$home]['up']}</li>
</ul>
</div> <!-- ここ -->
EOD;
	}

CSS の編集に関わる部分

• CSS が layout.css と color.css と printable.css の3つある
• CSS の編集は Windows 用の構造化エディタを使うと非常に効率よく行えるようになっている
• その関係で sjis, cr/lf になっている
• PukiWiki のデフォルト skin は CSS が EUC-JP で書かれていることを前提にしているので注意

嗜好に関わりそうな部分

• input, textarea の border をいじって、ちょっとフラットな感じを演出してるので好みに合わせて調整する
  • （スクロールバーが表示されないという現象は手元の IE5.5 SP2, IE6 SP1 では確認できない）
• input に hover で演出を入れてるので好みに合わせて調整する
• 凍結機能を編集画面に押し込んでいるので好みに合わせて調整する

認知を妨げる仕様

• MenuBar の部分に IE では表示されない四角を入れている
• IE に対していじわるな設定になっているのは以下の理由による
  • IE が first-child 擬似クラスに対応していない
  • first-child 擬似クラスを指定しているのは td#menubar 全部に対して border や background を指定すると、ページの中身が増えた場合に、MenuBar の部分で内容が終わっているにも関わらず四角が主張するので邪魔くさい
  • 印刷用の CSS はフォントも変更しているが、これが有効なのも Opera7 や Gecko ブラウザなので、IE のことは眼中にない :-)
• IE に優しくするためには、td#menubar に直接 border や background を設定して、div の border は取っちゃう
• それか td#menubar 直後の div に id をつける

ini ファイルに依存する部分

• default.ini.php で以下のように list のスタイルに関する記述をコメントアウトしておかないと CSS での調整がまったく効かない（style 属性で上書きされてしまう）

// リスト構造の左マージン
// $_ul_left_margin = 0;   // リストと画面左端との間隔(px)
// $_ul_margin = 16;       // リストの階層間の間隔(px)
// $_ol_left_margin = 0;   // リストと画面左端との間隔(px)
// $_ol_margin = 16;       // リストの階層間の間隔(px)
// $_dl_left_margin = 0;   // リストと画面左端との間隔(px)
// $_dl_margin = 16;        // リストの階層間の間隔(px)
// $_list_pad_str = ' class="list%d" style="padding-left:%dpx;margin-left:%dpx"';
$_list_pad_str = ' class="list%d"';

つーかこれは PukiWiki 1.4 の設計方針がおかしいでしょう。スタイルを CSS に分離すると言っておきながらなんで ini ファイルを利用して style 属性に埋め込んじゃうかなぁ。しかも px で。あと、やたらと px 単位なのはホントーにどうにかしてほしいのです。

※ 確かに list 周りを上手に調整するのは難しいですし、破綻しているブラウザもあるので気持ちは分かりますが。

CSS 関係のバグをまとめて回避する方法

1.4 から加わった、user agent を判別する処理を利用して、CSS 関係の激しいバグを持つブラウザに対して、CSS を適用しない skin を用意してやります。以下の手順でやってみてください。

1. ます pukiwiki.ini.php の

   $agents = array(

   の部分に

   array('name'=>'nocss','pattern'=>'#(Mozilla/[1-3])|(Mozilla/4\.([^0]|0[^\s]|0 \[))|w3m|iCab#')

   を加えます。（w3m は最初から無視なので意味ないんですし、他に避けたいブラウザの user agent が分かっていれば正規表現で加えていきます。）
2. すると nocss.ini.php が必要になります。default.ini.php をコピーして作ります。
3. nocss.ini.php の中で

   // スキンファイルの場所
   define('SKIN_FILE','./skin/nocss.skin.'.LANG.'.php');

   のように pukiwiki.skin.ja.php とは違う skin を呼び出しようにします。
4. で、上の例で言うと nocss.skin.ja.php を ini ファイルと同じように pukiwiki.skin.ja.php からコピーして作ります。
5. stylesheet を呼び出している link タグをカットします。

以上です。

• Prev
  ねこ丸
• Next
  ねこ丸/TSNETの捉え方
• Home
  Up