スキンの作り方 | RGT Download Site

スキンとは、ページのデザインやスクリプトの動作をまとめたパッケージで、スキンを変えることで様々な用途に対応できます。

RGT（実際に利用するCGIである、rgt.cgi）は、このスキンファイルを読み込むことでその動作を決定し、また表示するページレイアウトを決定しています。

スキンパッケージは、サイトデザインやレイアウトを決めるテンプレートファイルと、スキンの動作を決めるスキン動作設定ファイルに分けられます。

テンプレートファイルは基本的に HTML で書かれています。 またスキンの動作設定 skin.cgi では少し Perl の知識がいりますが、 出来るかぎり設定の書き換えで済むよう配慮しています。

現在ではブログの急速な普及もあって、テンプレート機能を持ったスクリプトは珍しいものではなくなっています。 （RGT を最初に作ったのは 2002 年、ブログが普及し始めた頃）

しかし、このような機能がどのように動くか、ご存知ない方のために少し解説しておこうと思います。スキンを作られる際にも参考になることがあるでしょう。

スクリプトを利用する際、rgt.cgi（以降、RGT) にアクセスします。
RGT は、まず skin.cgi を読み込み、どのような項目やランクが必要なのか調べます。その情報に基づき、データファイル dat.cgi から登録されているデータを取り出します。そして、そのデータをどのようなレイアウトで表示するのかを、テンプレートファイルを読み込み、データとテンプレートを照らし合わせ、適切な形で、最終的に『ページ表示』します。

通常、rgt.cgi にアクセスしたときにはすぐにページ表示されると思いますが、処理の実際はこのようなことを行っています。

最低限必要な、スキンのファイルリストは以下になります。

• main.html（メインページのHTMLテンプレート）
• reg.html（登録ページのHTMLテンプレート）
• edit.html（編集ページのHTMLテンプレート）
• sys.css（その他ページで使用するスタイルシート）
• skin.cgi（スキンの動作設定ファイル）

• メンバーのランク付けができます（ギルドマスター等。高ランク順にメンバー表示される）
• ランクごとのテンプレート・最大登録数・ランク数・ランク名が設定できます
• たとえば「ギルドマスターは３人まで」なんてことや、新しいランク名を作ることもできます
• 入力できる項目数や項目名は自由に設定できます
• テンプレートはメインページ・登録ページ・変更ページの３つが作れます
• メインページの表示処理に Perl スクリプトを追加することができます

簡単にまとめてみました。

項目数の制限はいちおうないのですが、当然増えるにしたがい負荷が上がり処理に時間がかかるようになります。 またテンプレートファイルのサイズも同様に、容量が増えるほど走査に時間と負荷が掛かります。スキン作成時には留意ください。

RGT は Shift-JIS （シフトJIS）の文字コードでのみ正常動作します。
スキンをカスタマイズされる際、全てのテキストファイルは必ず Shift-JIS に統一してください。
(～.html ～.cgi ～.css などのファイル）

ダウンロードページで配布しているスキンはデザイン上中身が分かり辛いので、簡単なスキンを用意しています。 できるだけ HTML ソースを少なくするため最低限のレイアウトしかしていませんが、 その分構造が分かりやすくなっていると思います。 スキン作成の参考に役立ててください。

>>サンプルスキンをダウンロード

テンプレートファイルは、HTML そのものであり、従来のホームページを作成するときの HTML とほぼ変わりはありません。
※厳密には『HTML』でなくとも、『XHTML』であっても構いません。RGT は読み込んだものをそのまま出力するだけの、ティーバッグの「ろ過紙」のようなものです。

RGT はページを表示する前にテンプレートファイルを読み込み、登録されたデータをどこに表示すれば良いのか、テンプレートの内容を探します。
そのため、テンプレートの中に、データを表示させるための目印である独自タグを記述しておく必要があります。（そうでないと、それはただの HTML ファイルです）

実際はどのようになるのかというと...

■テンプレートファイル

....
...
<h2>!name!</h2>
<p>!comment!</p>
...
....

■実際に表示されるページのHTML

....
...
<h2>ria</h2>
<p>エリンの明日の天気をお知らせします。</p>
...
....

このようになります。

基本的にテンプレートは、通常ホームページを作成するときのように作っていきます。その後、独自タグを入れるだけです。（あくまで「基本的には」です。実際の使い方としては、RoStatのようなJavaScriptと連動させたり、など使い道はいろいろあるでしょう）
※『!name!』や『!comment!』が独自タグです。

RGT ではこの独自タグを自由に作ることができます。独自タグを入れる箇所は、テンプレート内のどこでも構いません。レイアウトやサイトデザインはユーザに任されているからです。

このファイルは、メインページのテンプレートです。
rgt.cgi（以下 RGT）にアクセスしたときに最初に表示され、通常、最もよく使われます。

このテンプレートは、ヘッダー、エントリ、フッターと、ブロックごとに分けられます。
以下のように、必ずブロックの区切りを記述しておく必要があります。

[ヘッダー部]
<!-- Header END -->　←ココ（区切り
[エントリ部]
<!-- Member END -->
[フッター部]

エントリ部は、skin.cgi のランク設定で区切る文字列が変化します。
@rank = ('GuildMaster', 'Member'); と設定されている場合、

[ヘッダー部]
<!-- Header END -->
[エントリ部]（GuildMaster)
<!-- GuildMaster END -->
[エントリ部]（Member)
<!-- Member END -->
[フッター部]

というように記述します。

RGT はヘッダー部から順に、エントリ、フッターと出力（表示）していきます。エントリ部は、表示するエントリ数の回数分、繰り返し出力します。

■用意されている独自タグ

ヘッダー部

!copyright!

RGT の著作権表記が表示されます

!ver!

スキンのバージョンが表示されます

!skindir!

skin ディレクトリのパスが表示されます

!script!

rgt.cgi のパスが表示されます

!home!

ホームページの URI が表示されます

!add_f!

登録ページの URI が表示されます

!edif_f!

編集ページの URI が表示されます

!del_f!

削除ページの URI が表示されます

!cgititle!

スクリプトのタイトル名が表示されます

!subtitle!

スクリプトのサブタイトル名が表示されます

!reg!

エントリの登録数が表示されます

!yr!

データファイル dat.cgi の更新日時「年数」が表示されます

!mo!

（同上）の、「月」（数字表記）が表示されます

!mon!

（同上）の、「月」（文字表記）が表示されます

!da!

（同上）の、「日」が表示されます

!wd!

（同上）の、「曜日」が表示されます

エントリ部

!skindir!

skin ディレクトリのパスが表示されます

!edit!

エントリを編集するページの URI が表示されます

!del!

エントリを削除するページの URI が表示されます

!permal!

エントリの URI が表示されます（特定エントリのみ表示する)

!id!

エントリの ID が表示されます

!rank!

エントリのランク名が表示されます

!img!

登録された画像ファイル（imgタグ）が表示されます

!yr!

エントリの更新日時「年数」が表示されます

!mo!

（同上）の、「月」（数字表記）が表示されます

!mon!

（同上）の、「月」（文字表記）が表示されます

!da!

（同上）の、「日」が表示されます

!wd!

（同上）の、「曜日」が表示されます

ほか、skin.cgi で設定しただけの項目が使用できます。



フッター部

!log!

他のページへ移動するリンクが表示されます

ほか、ヘッダー部と同じタグが使用できます。

このファイルは、登録ページのテンプレートです。
ヘッダ部・フッタ部などのブロック分けはありません。
登録情報を入力するフォームを用意する必要があります。

用意されている独自タグ

!skindir!

skinディレクトリのパスが表示されます

!script!

rgt.cgiのパスが表示されます

!cgititle!

スクリプトのタイトル名が表示されます

!subtitle!

スクリプトのサブタイトル名が表示されます

!rank!

ランクの選択メニュー（selectタグ）が表示されます

!img!

画像ファイル（imgタグ）が表示されます

!maxd!

登録できる最大キロバイト数が表示されます

!maxw!

登録できる画像の最大横幅が表示されます

!maxh!

登録できる画像の最大縦幅が表示されます

!imgtype!

登録できる画像のファイルタイプが表示されます

!imglock!

登録した画像の扱い（分かりにくいですが）が表示されます

!hidden!

フォームに必要なデータが表示されます（必ず、<form>～</form>の間に入れてください）

!pwdmax!

パスワードの最大文字数が表示されます

!ver!

スキンのバージョンが表示されます。

ほか、skin.cgi で設定しただけの項目が使用できます。

このファイルは、編集ページのテンプレートです。
ヘッダ部、フッタ部などのブロック分けはありません。
登録情報を編集するフォームを用意する必要があります。

reg.html と同じタグが使用できます。