Snow-Materia > Relm & Jinny > スキンの選択・変更


Page Guide
Anchor
スキンの選択
管理画面の「スキンの選択」について
スキンデザインの変更
管理画面の「スキンデザインの変更」について
スタイルシートの書きかた
スタイルシートの推奨する書きかたについて
ミニマムスキン
ケータイ、モバイル用の、スキンについて

Preamble

このページでは、 ver2.0から加わった管理画面の スキンの選択スキンデザインの変更、 という2つの機能にスポットを当てて解説しています。 ミニマムスキンの簡単な注意ごともこちらです。

スキンの配布については、前のページの スキンの配布・リンク のページをご覧ください。

スキンのシステムについては、また次のページの スキンのシステム のページをご覧ください。


Contents

スキンの選択

Relm-ver2.0から、管理画面に、「スキンの選択」というのができました。

これは、使いたいスキンファイルを、スキンフォルダ(skin/)に入ってる、ファイルのリストの中から選んで、ワンタッチで変更できるようにしたものです。

このリストに加えられるファイルには、条件があります。それは名前です。

以下のようなファイル名で、スキンの種類を判別してます。

Relmのスキンの種類

メインスキン ($r_skin)
l_skin***.htm
カタログスキン($c_skin)
l_cata***.htm
フォームスキン($w_skin)
l_form***.htm
リストスキン ($l_skin)
l_list***.htm
ペイントスキン($p_skin)
l_paint***.htm
ミニマムスキン($k_skin)
l_mini***.htm
スタイルシート($css)
***.css

Jinnyのスキンの種類

メインスキン ($j_skin)
j_skin***.htm
メニュースキン($m_skin)
j_menu***.htm
フォームスキン($w_skin)
j_form***.htm
カタログスキン($c_skin)
j_cata***.htm
ペイントスキン($p_skin)
j_paint***.htm
ミニマムスキン($k_skin)
j_mini***.htm
スタイルシート($css)
***.css

***」は任意、ということ。「.htm」の部分は「.html」でもいいです。

例えば、l_skin_mayo.htmlというファイルがあれば、中身に関係なく(笑)、そのファイルはメインスキンである、とされ、メインスキンのリストに並べられます。

この指定以外だと、どうがんばっても、スキン選択のリストに加えられません。逆に、リストに加えたくない場合は、他の名前にしてやるといいです。

もし納得がいかなくても、そういう仕様なんで、諦めてください。(笑)

CGIの設定から設定する分には、どんなファイル名でも大丈夫です。



スキンデザインの変更

ver2.0から、管理画面に、「スキンデザインの変更」というメニューができました。

これは、ブラウザ上から、スキンファイルやスタイルシートのソースを手っ取り早く書き換えてしまおう、というものです。

書き換えできるファイルは、スキンフォルダ(skin/)にあり、上のルールに従って、スキンリストに加えられたファイルの中から、だけです。

ファイルのパーミッションも666とか600になってる必要があります。

メリットは次の通り。

デメリットとして。

手順。

書き換え終わったら、普通の画面に飛んで、確認してください。設定してあるスキンを変えたら、HTML更新も行ってください。大丈夫だったら、変更完了です。おつかれさま。



スタイルシートの書きかた

スタイルシートについてとくに個人の記述方法にとやかく言うつもりは無いのですが、システム的に、こうしてくれると便利だよ、っていうことを。

スキンデザインの変更のとこでは、スタイルシートも編集できます。

そのとき、「一括 or 分割」 というのがあるのですが、スタイルシートの場合、特定の書きかた、行頭から行端までが、/* ○○○ */という1行を入れると、そこで分割されていきます。

例えば、

----------------------------------------
input{
	color:#999999;
}
select{
	color:#808080;
}
textarea{
	color:#666666;
}
----------------------------------------
	↓
----------------------------------------
/* フォームタグ系 */
input{
	color:#999999;
}
select{
	color:#808080;
}
textarea{
	color:#666666;
}
----------------------------------------

こんな感じにします。すると、

フォームタグ系

と、フォームタグ系でひとつのエリアになってくれます。

「よくわからん(*゜¬゜)?」、って人は、最初に入ってる../cgi.cssで、実際にやってみてください。ずらっと分割されて並ぶと思うので。

一括だと、どこに何があるかわからない時も多いので、最初にこういうことをしてると、あとで探しやすくて楽ですよ。



ミニマムスキン

ミニマムスキンは、ほぼケータイ、モバイル用の、スキンです。最初にDLするとskin/l_mini.htmとなってるファイルです。

ミニマムモードの細かい説明は機能のページにまかせます。

ミニマムスキンを改造するにあたり、一番注意するところは、メイン画面のソースと、フォーム画面のソースを、ミニマムスキン1つのファイルで兼用していること。

つまり、<!--BODY_START--> ~ <!--BODY_END-->と、<!--WRITE_START--> ~ <!--WRITE_END-->と、2つ中に書いてあります。

メイン画面のソースが、<!--BODY_START-->~で、フォームのソースが、<!--WRITE_START-->~ですね。

最初は分けようか、とも思ったんですが、これ以上、設定やスキンファイルを増やすのもどうか、と思ったので、こうしました。…いかがでしょうか。

ヘッダー<!--HEAD_START-->~と、フッター<!--FOOT_START-->~は、ミニマムモードなら、各画面で共通なので、1つずつです。

なるべく余計なタグとか入れないようにしたつもりですが、7は携帯使わないので、実際使いやすいのか、見やすいのか、わかりません。…なので、「こうした方がいいんじゃない?」とかいうのがあれば、参考にしますので、もしご意見・ご要望などあったら、よろしくです。



Page Information
Toc
Relm
Prev
Next
First
2003.12.18
Last
2005.01.21