|
1: 2007-01-06 (土) 15:22:34 nao-pon   |
| | + | * スタイルシートについて [#ua97f3ce] |
| | | | |
| | + | xpWiki では、デフォルトの表示状態(defaultスキン)でのCSSをXOOPS_TRUST_PATH 側に持っています。ただ、CSSを独自にカスタマイズした場合に、バージョンアップするとカスタマイズした分が元に戻ってしまいます。 |
| | + | |
| | + | それでは具合が悪いので、スタイルシート(CSS)のオーバーライト(上書き)を取り入れています。 |
| | + | |
| | + | まずは、defaultスキンを使っている場合について説明します。 |
| | + | |
| | + | オーバーライトするために修正すべきファイルは、XOOPS_ROOT_PATH/modules/[module_dir]/skin/default/pukiwiki.css.php です。 |
| | + | |
| | + | pukiwiki.css.php は次のような内容になっています。 |
| | + | |
| | + | #code(php){{ |
| | + | <?php |
| | + | define('_LEGACY_PREVENT_LOAD_CORE_', TRUE); // for XOOPS Cube Legacy |
| | + | $xoopsOption['nocommon'] = true; |
| | + | require '../../../../mainfile.php' ; |
| | + | if( ! defined( 'XOOPS_TRUST_PATH' ) ) die( 'set XOOPS_TRUST_PATH in mainfile.php' ) ; |
| | + | |
| | + | require '../../mytrustdirname.php' ; // set $mytrustdirname |
| | + | |
| | + | // Base |
| | + | $base = isset($_GET['base']) ? "_".preg_replace("/[^\w-]+/","",$_GET['base']) : ''; |
| | + | $class = "div.xpwiki".$base; |
| | + | |
| | + | $overwrite = <<<EOD |
| | + | /* Here is an overwriting section. |
| | + | * Please use $class in selector. */ |
| | + | |
| | + | EOD; |
| | + | |
| | + | include XOOPS_TRUST_PATH.'/modules/'.$mytrustdirname.'/skin/'.basename(__FILE__); |
| | + | ?> |
| | + | }} |
| | + | |
| | + | この中で、CSSを記述する箇所は |
| | + | #code(php){{ |
| | + | $overwrite = <<<EOD |
| | + | /* Here is an overwriting section. |
| | + | * Please use $class in selector. */ |
| | + | |
| | + | EOD; |
| | + | }} |
| | + | です。 |
| | + | |
| | + | 例えば<h>タグの色を変えたい場合は、次のようになります。 |
| | + | |
| | + | #code(php){{ |
| | + | $overwrite = <<<EOD |
| | + | /* Here is an overwriting section. |
| | + | * Please use $class in selector. */ |
| | + | $class h1, |
| | + | $class h2 { |
| | + | font-family:verdana, arial, helvetica, Sans-Serif; |
| | + | color:inherit; |
| | + | background-color:#9ACD32; |
| | + | padding:.3em; |
| | + | border:0px; |
| | + | margin:0px 0px .5em 0px; |
| | + | text-align: left; |
| | + | } |
| | + | $class h3 { |
| | + | border-bottom: 3px solid #9ACD32; |
| | + | border-top: 1px solid #9ACD32; |
| | + | border-left: 10px solid #9ACD32; |
| | + | border-right: 5px solid #9ACD32; |
| | + | } |
| | + | $class h4 { |
| | + | border-left: 18px solid #9ACD32; |
| | + | } |
| | + | EOD; |
| | + | }} |
| | + | |
| | + | $class は、モジュールディレクトリ名にあわせたクラスセレクタ文字列に置換されます。 . . |
下位
ページへ戻る
リンク元
メインメニュー
