ホームページ作成の裏技!

自動登録型リンク集を作ってみよう!@ の巻

誰が内容を書くのか?

久しぶりの更新となってしまいました・・・。大変お待たせしました!今回は自動登録型リンク集の作り方です。

前回までは あくまでも「管理者」が内容を書くことを前提にしていました。
管理者が記事を追加・更新していくために使用するのが[コンテンツエディタ]というCMS機能です。これに対して サイト訪問者(第三者)が 内容を追加・更新できるシステムが[掲示板]システムです。

「え〜掲示板でリンク集??」と 訳がわからない方もいらっしゃるかと思いますが(^^;) とにかく第三者が記事更新するには 形は違えど掲示板だ!と認識してください。話はそこから始まります。

今回作成する「自動登録型リンク集」は 一体誰が内容を書くのでしょう?管理者も書きますが リンクしたい人が自由に追加できるのが 「自動登録型」なる所以ですよね。ということは 管理者以外の第三者も 内容を書くことがあると言うことになります。

入力フォームの作成

サイト訪問者に入力してもらうには 入力用の画面というものを作らなければなりません。普通にHTMLを作成する分には あまり使わないかもしれませんが <form>タグを使用します。<input type='button'>や<input type='text'>などの form部品といわれるものを 囲むタグです。これらの入力用のオブジェクトがないと 入力は出来ません。管理者が入力するだけのコンテンツエディタを使用した場合は この入力画面は自動的に作成されましたが 第三者に見せる入力画面ですから 自分のサイトデザインに合わせて作ってください。

今回の例では 新規登録ボタンを押すと 入力フォームが表示されるようにしたいと思います。テーブルで表示される方が 入力しやすいだろうということで 以下のようなソースを書きました。
<form action='$this_name' method='POST'><input type='hidden' name='bbs_mode' value=''><input type='hidden' name='bbs_thrno' value=''><input type='hidden' name='bbs_selectno' value=''><input type='hidden' name='bbs_page' value='$bbs_page'><table class='FanSite'>&nbsp;&nbsp;<tr>&nbsp;&nbsp;&nbsp;&nbsp;<th>サイト名</th>&nbsp;&nbsp;&nbsp;&nbsp;<td><input type='text' size='80' maxlength='80' name='bbs_topic' class='ime-active'></td>&nbsp;&nbsp;</tr>&nbsp;&nbsp;<tr>&nbsp;&nbsp;&nbsp;&nbsp;<th>サイトURL</th>&nbsp;&nbsp;&nbsp;&nbsp;<td><input type='text' size='80' maxlength='120' name='bbs_url' class='ime-disable'></td>&nbsp;&nbsp;</tr>&nbsp;&nbsp;<tr>&nbsp;&nbsp;&nbsp;&nbsp;<th>バナーイメージ</th>&nbsp;&nbsp;&nbsp;&nbsp;<td><input type='text' size='80' maxlength='80' name='bbs_sub0' class='ime-disable'></td>&nbsp;&nbsp;</tr>&nbsp;&nbsp;<tr>&nbsp;&nbsp;&nbsp;&nbsp;<th>管理者名</th>&nbsp;&nbsp;&nbsp;&nbsp;<td><input type='text' size='80' maxlength='80' name='bbs_name' class='ime-active'></td>&nbsp;&nbsp;</tr>&nbsp;&nbsp;<tr>&nbsp;&nbsp;&nbsp;&nbsp;<th>ジャンル</th>&nbsp;&nbsp;&nbsp;&nbsp;<td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<select name='bbs_sub1'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<option value='情報'>情報</option>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<option value='ブログ/日記'>ブログ/日記</option>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<option value='素材'>素材</option>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<option value='スクリプト'>スクリプト</option>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<option value='イラスト'>イラスト</option>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<option value='その他'>その他</option>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</select>&nbsp;&nbsp;&nbsp;&nbsp;</td>&nbsp;&nbsp;</tr>&nbsp;&nbsp;<tr>&nbsp;&nbsp;&nbsp;&nbsp;<th>サイト紹介文</th>&nbsp;&nbsp;&nbsp;&nbsp;<td><textarea name='bbs_text' cols='60' rows='10' class='ime-active'></textarea></td>&nbsp;&nbsp;</tr>&nbsp;&nbsp;<tr>&nbsp;&nbsp;&nbsp;&nbsp;<th>パスワード</th>&nbsp;&nbsp;&nbsp;&nbsp;<td><input type='password' size='20' maxlength='8' name='bbs_pass' class='ime-disable'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type='button' value='登録' onclick='SetValueSubmit(this.form,"bbs_mode=write");'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type='button' value='キャンセル' onclick='SetValueSubmit(this.form,"bbs_mode=");'>&nbsp;&nbsp;&nbsp;&nbsp;</td>&nbsp;&nbsp;</tr></table></form>
お約束的に覚えて欲しいのは以下の点です。
@フォームタグに action='$this_name' と method='POST' を必ず記述する。
A上記ソース内の<input type='hidden' 〜〜>の各行は 必ずフォームタグ直下に記述する。Bフォーム部品には bbs_ で始まる変数名をつける。(使える変数は決まっています。)
Cフォーム部品には(どうしても初期値を固定したい場合を除いては) value属性を記述しない。
Dパスワード入力部分は 必ず記述する。
E登録を実行したい場合は 必ず SetValueSubmit(this.form,"bbs_mode=write") という関数をコールする。

最初は ???の連続だと思いますが 作っていくうちに見えてきます。ちょっとずつ理解していきましょう(^^;)。解れば 簡単に思えます。
長丁場で出来る限り丁寧に解説して行こうと思いますので 今回はここまでです。




NetMall
宿NetMall
宿帳くん
Powered by Homepe.net