デザインのカスタマイズ
既存の掲示板スクリプトの多くは、デザイン変更を行う際にプログラム中に埋め込まれたHTMLコードを変更する必要がありました。
この作業には、プログラミングに関する知識を要したり、プログラム内に分散したHTMLコードを修正する面倒さがありました。
本掲示板プログラムは、
Bloggerなどでも採用されているテンプレートに似たデザイン・カスタマイズ機構を実装しています。
これによって、プログラム内のHTMLコードを拾い集めることなく、テンプレートファイル(CSS/HTML)を変更することで、簡単にデザイン変更を行うことができます。
テンプレートファイル
テンプレートファイルは5つあり、それぞれPHP掲示板の各ページに対応しています。
bbs.phpは、各ページごとに適切なテンプレートファイルを読み込んで、掲示板の表示処理を行います。
テンプレートファイルは、完全なCSS/HTMLファイルです。
デザインを変更するときは、このファイルをエディタや各種オーサリングツールで編集し、
テンプレートファイルを直接Webブラウザで開いて見え方を確認してください。
| ファイル名 | 対応するページ、役割 |
|---|---|
| _archive.html | 過去ログページです。 既定で100件ごとに過去の投稿を表示します。 過去ログのページ切り替えアンカーなどがあります。 |
| _confirm.html | 投稿の確認ページです。 投稿完了前にこのページで、投稿の見え方を確認します。 修正用のフォームもあります。 |
| _data.html | 投稿データの個別ページです。 投稿本文中の2ch引用記法「>>(番号)」は、 このページにリンクしています。 |
| _key.html | 削除キーの入力ページです。 削除対象の投稿データを表示し、削除キーの入力フォームがあります |
| _top.html | PHP掲示板の既定ページです。 投稿フォームや、最新投稿のページ切り替えアンカー、過去ログページなどへのリンクがあります。 |
変数
投稿本文などのユーザが入力する任意のデータは、テンプレートファイル内では変数として表現されています。 これはSmartyテンプレートなどでおなじみの{$...}形式で表現され、 ページ表示処理の際にbbs.phpが実際のデータに置き換えます。 下記にテンプレートファイル内での変数の記述例を示します。
投稿データ変数
掲示板ユーザの投稿データに関わる変数です。 表示位置などを工夫して、見やすく使いやすい掲示板にしてください。
| 導入 Ver. |
変数名 | 説明 |
|---|---|---|
| - | {$error} | エラーメッセージ。 主に投稿確認ページ(_confirm.html)で使用し、 入力した投稿データに対する警告を表示します。 |
| - | {$pager} | 最新投稿の表示ページ切り替えアンカー。 |
| - | {$archive_anchors} | 過去ログの表示範囲アンカー。 |
| - | {$id} | 投稿データID。 そのページで表示する投稿データが一意に決まるとき、表示します。 削除キー入力ページ(_key.html)、投稿データ個別ページ(_data.html)等で有効です。 |
| - | {$subject} | 投稿のタイトル。 |
| - | {$name} | 投稿者の名前。 |
| - | {$email} | 投稿者のEメールアドレス。 Ver.20061127b以降では迷惑メール対策のため、HTMLエンティティに変換して出力します。 |
| 20061127b- | {$mailto_name} | mailtoアンカー付きの投稿者の名前。 メールアドレスがあるとき、mailtoアンカーを付けて表示。 迷惑メール対策のため、メールアドレスはHTMLエンティティに変換されます。 |
| - | {$password} | 削除キー。 投稿確認ページ(_confirm.html)で使用しています。 一方向変換してログファイルに保存されるため、 既定ページ(_top.html)など他のページで用いるのは、適切でありません。 |
| - | {$time} | 投稿時刻。 繰り返し構造の外で用いる場合は、 削除キー入力ページ(_key.html)、投稿データ個別ページ(_data.html)でのみ意味を持ちます。 |
| - | {$body_text} | URLの自動リンク処理などをしない投稿本文。 投稿確認ページ(_confirm.html)の修正フォームで使用しています。 |
| - | {$body_html} | URLの自動リンク処理などを行った投稿本文。 削除キー入力ページ(_key.html)、投稿データ個別ページ(_data.html)で使用しています。 |
| - | {$host} | 投稿者のホスト名またはIPアドレス。 投稿者のプライバシー等への配慮から、既定のテンプレートでは使用していません。 |
| - | {$useragent} | 投稿者のUserAgent(使用するブラウザの表示名など)。 削除キー入力ページ(_key.html)、投稿データ個別ページ(_data.html)で使用しています。 |
| - | {$remove_anchor} | 投稿データごとの削除キー入力ページ(_key.html)へのURL。 <a>タグのhref属性値などに使用します。 |
| 0.20- | {$file_link} | アップロードしたファイルの縮小画像、またはダウンロードリンク(画像以外の場合) |
| 0.20- | {$file_info} | アップロードしたファイルの内部データ表現。_confirm.htmlのhiddenタグvalue属性値として記述します。 |
URL変数
PHP掲示板の各ページのURLです。<a>タグのhref属性値などに利用します。
| 導入 Ver. |
変数名 | 説明 |
|---|---|---|
| - | {$BBSPATH} | 既定ページ(_top.html)のURL |
| - | {$BBSPATH_RSS} | 最新投稿RSSのURL |
| - | {$BSSPATH_ARCHIVE} | 過去ログページ(_archive.html)のURL |
システム変数
主にPHP掲示板の動作に必須の変数です。 下記変数の記述個所は、テンプレートファイルから削除しないようにしてください。
| 導入 Ver. |
変数名 | 説明 |
|---|---|---|
| - | {$BBS_VERSION} | 掲示板プログラムのバージョン |
| 20061127b - (0.1b) | {$ENCODING} | 文字エンコーディング。Ver.0.1bまで使用、以後削除。 |
| - | {$MODE_PAGE} | 表示ページまたは処理モードをあらわす定数値 |
| - | {$MODE_CONFIRM} | |
| - | {$MODE_SUBMIT} | |
| - | {$MODE_KEY} | |
| - | {$MODE_REMOVE} | |
| - | {$MODE_ARCHIVE} | |
| - | {$PARAM_MODE} | 投稿データ各項目のフォーム要素名称 |
| - | {$PARAM_ID} | |
| - | {$PARAM_SUBJECT} | |
| - | {$PARAM_NAME} | |
| - | {$PARAM_EMAIL} | |
| - | {$PARAM_BODY} | |
| - | {$PARAM_PASSWORD} | |
| - | {$PARAM_FILE} | |
| 0.21- | {$PARAM_AU} | au携帯のpostリクエスト検出用パラメータ。<input type="hidden">タグname属性値で使用 (_top.html, _confirm.html) |
| - | {$SIZE_NAME} | 投稿データ各項目の許容サイズ (単位：bytes) |
| - | {$SIZE_EMAIL} | |
| - | {$SIZE_SUBJECT} | |
| - | {$SIZE_PASSWORD} | |
| 0.21- | {$AU_ATR} | au携帯のpostリクエスト検出用文字列。<input type="hidden">タグvalue属性値で使用 (_top.html, _confirm.html) |
繰り返し構造
既定ページ(_top.html)や過去ログページ(_archive.html)などでは、
20件や100件といった複数の投稿データを繰り返し表示します。
こうしたページのテンプレートファイルでは、
特別なタグに囲まれた領域に投稿データ1件分のデザインをHTMLで記述します。
bbs.phpが投稿データを表示するときは、
この特別なタグで囲われた領域を表示件数分まで展開してから表示します。
特別なタグとは<BBSData>...</BBSData>で、
PHP掲示板ではこれを「繰り返し構造」と呼んでいます。
下記にテンプレートファイル内での記述例を示します。
投稿データ変数のうち下記に示す変数は、 <BBSData>...</BBSData>で囲われた繰り返し構造の内部で機能が変化します。
| 導入 Ver. |
変数名 | 説明 |
|---|---|---|
| - | {$id} | 投稿データID |
| - | {$subject} | 投稿のタイトル |
| - | {$email} | 投稿者のEメールアドレス |
| - | {$time} | 投稿時刻 |
| - | {$body_html} | URLの自動リンク処理などを行った投稿本文 |
| - | {$host} | 投稿者のホスト名またはIPアドレス |
| - | {$useragent} | 投稿者のUserAgent(使用するブラウザの表示名など) |
| - | {$remove_anchor} | 投稿データごとの削除キー入力ページ(_key.html)へのURL |
| 0.20- | {$file_link} | アップロードしたファイルの縮小画像、またはダウンロードリンク(画像以外の場合) |