HOME > CGI > おされさん > 一覧画面の作り方

一覧画面の作り方

■$list_htmlの作り方

一覧画面とは下記のような画面の事です。

特定項目をクリック(下記の画面例だとNo.をクリックとなります)すると、その記事の
詳細画面を表示します。


▼基本記述例
<div align="center">
<p><br>
<!--inputform-->
一覧画面サンプル </p>
<table width="80%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td bgcolor="#000000"><table width="100%" border="0" cellspacing="1" cellpadding="8">
<tr bgcolor="#FFCC00">
<td width="2%">No.</td>
<td width="25%">名前</td>
</tr>
<!--cut-->
<tr bgcolor="#FFFF99">
<td width="2%" align=right>#no</td>
<td width="50%"><!--detaillink-->#name</a></td>
</tr>
<!--cut-->
</table>
</td>
</tr>
</table>
<p>
一覧画面サンプルの繰り返しのうしろ。
</div>


一覧画面用HTMLファイルにはヘッダー定義(<HTML>、<HEAD>、<BODY>タグ)は
記述しないで下さい。

記述方法
■記事を表示する部分(記事が繰り返し表示される部分)を<!--cut-->
で囲みます。

<!--detaillink-->#コントロール名で、その項目に『詳細画面へのリンク』が
張られます。
「コントロール名」はオプションを除いた名前です。
例: f_name_YY→f_name、f_comment_NNNNY→f_comment

<table>
<tr><td>No.</td><td>名前</td>
<!--cut-->
<tr><td><!--detaillink-->#no</td><td>$name</td>
<!--cut-->
</table>


一覧部分の上に【入力フォーム】を表示させる場合
記述 <!--inputform-->
動作 記述したところに入力フォームが表示されます
説明 ■繰り返し部分(<!--cut-->と<!--cut-->の間)には記述してはいけません。
■通常$list_htmを利用する場合は、入力フォームは表示されませんので、
入力フォームも表示したい場合は同設定が必要となります。

一覧部分の上に【入力フォームへのリンク】を付ける場合
記述 <!--inputstart-->
<input type="submit" value="私もプロフィールを登録したい">
<!--inputend-->
動作 クリックすると入力フォームが表示されます
説明 submitボタンを使わないで、通常の<A>タグでリンクする場合は、
<!--inputstart-->と<!--inputend-->は不要で、

<a href="cgiスクリプト名?action=write">新規投稿</a>

のように記述して下さい。

レス有り掲示板の場合($mail_htmlで、<!--resstart-->〜<!--resend-->の設定がある場合)、
一覧部分に【返信数】 を表示させたい
記述 #RESCNT
動作 その親記事に対して投稿されたレス記事数が表示されます。
説明
※現状「最新投稿者名」には対応していません。

レス有り掲示板の場合($mail_htmlで、<!--resstart-->〜<!--resend-->の設定がある場合)、
一覧部分に【最新投稿日】 を表示させたい 
記述 #NEWDATE<!--日付・時間表示形式-->
動作 その記事に対しての最新投稿日を表示します。
説明

例:

の場合は、 #NEWDATE<!--yy/mm/dd(w1)<br>h:nn:s-->

■日付・時間表示形式については、こちらをご覧下さい。


レス有り掲示板の場合($mail_htmlで、<!--resstart-->〜<!--resend-->の設定がある場合)、
一覧部分に【新着表示】 を表示させたい 
記述 #NEWIMG<!--新着とする時間--><img src="画像ファイル名">
動作 「新着とする時間」より以降に投稿された記事を「新着」とし、
<img>で指定された画像を表示します。
説明 :24時間前以降に投稿された記事を新着とする場合
#NEWIMG<!--24--><img src="画像">

検索窓を設置する
記述 メイン画面(ヘッダー部)の作り方の「検索窓を設置する」と同様

 


前へ
 次へ

このページのTOPへ