ホームページビルダー小技編
ページ、レイアウト関連
- 「お気に入りに追加」したときに表示されるアイコンの設置
- ビルダーにある、サンプルCGIを利用する(メールフォーム)
- 角の丸い表の作成
- 数秒後に別サイトへジャンプ
- ページを閉じるときアニメーションのようにして閉じる
- リンクをはった文字列にマウスポインタが乗ったとき短い説明文を表示する
- テーブルを使ってレイアウト(フレームを使っているようで使っていないページ)
- サンプル画像を使って、テーブルでレイアウトしてみる
ビルダー付属のCGI
サンプルCGIに問題があるとして修正プログラムが公開されています。(2007/06)
ビルダー付属のCGIをご利用の方はぜひご覧ください。
IBMサイト 「ホームページ・ビルダーのサンプル CGI の脆弱性について」
ビルダーに用意されているCGIプログラムがいくつかあります。
アンケートフォームや掲示板など、デザインを自分好みに変更することができます。
作成例
ただし、機能については、CGIスクリプトの内容変更が必要になります。
他にもあります。フォームメールを作成する方法
※ 設置済みサンプルは別ウィンドウで開きます
CGIを使わないフォームメール(チェック機能付き)
※ チェック機能が必要ではない場合は、JavaScriptなしでも入力フォームから送信できます。
入力部品
※ お使いのプロバイダがOCNの場合は、OCNが用意しているフォームメールを利用することができます。
PageON用
サンプルCGIのある場所
■「ホームページ・ビルダー V*」 *の部分を利用しているバージョンに置き換えて探してください。
下記の場所にあります。
C:\Program Files\IBM HomePage Builder V*\sample\cgi を開くと、利用できるサンプルの一覧と使い方を確認できます。
C:\Program Files\IBM HomePage Builder V*\sample\cgi\index.htm
ビルダー付属のアンケートフォームの利用
アンケートフォームのサンプルを利用してメールフォームを作成してみます。
※注意 このアンケートフォームはV8のウィザードで作成するアンケートフォームではありません。
作成の前に、確認しておくことがあります。
- 契約しているプロバイダ(ホームページデータを転送しているところ)は自作CGIを設置することができるか。
プロバイダ側が用意しているCGIしか使えないという所もありますので、確認をしてください。 - sendmailが使えるか。
掲示板などのCGIは設置できてもsendmailは使えないというサーバーは多くあります。確認をしてください。
以上のことがOKならば、ビルダー付属のアンケートフォームが利用できます。
もし、上記の条件に当てはまらなかった場合は、こちらの「CGIを使わないフォームメール」を参考にしてください。
もし、ご利用のプロバイダがOCNであれば、プロバイダ側が用意したフォームメールを利用できます。こちらを参考に。
(また、OCN以外でもご利用のプロバイダでフォームメールを用意している場合が多くありますので、確認してみるといいと思います。)
自分好みに変更する。
ホームページビルダーの公式サイトに詳しい説明がありますので、その説明を参考にメールフォームを作成していきたいと思います。 参考ページ
「フォームを利用してアンケートを作成してみましょう 」
当サイトで用意したモノは、公式サイトのヒント集「フォームを利用してアンケートを作成してみましょう 」の設定手順3番のメールフォームの基本フォームのみです。
その他、CGIの設定、メールアドレスの設定、アクション欄の設定は利用するプロバイダによって違いますので各自で設定する必要があります。また、設置についてはサンプルCGIのフォルダに詳しい説明があります。
場所 >> C:\Program Files\IBM HomePage Builder V*\sample\cgi\sample3.htm
基本フォーム
下記は、基本フォームのソースです。コピーし、「HTMLソースの貼り付け」を参考に、ページに貼り付けてご利用ください。
変更箇所
・「"mailaddress@sample.jp"」の部分を自分のメールアドレスに変更。
・同じフォルダ内に基本フォームのファイルとanketo.cgiを保存する場合は変更の必要はありませんが、anketo.cgiと基本フォームのファイルを別々のフォルダに保存する場合は、「action="anketo.cgi"」のパスを変更してください。
<!--ここから-->↓このようなテーブルが表示されます。
<form action="anketo.cgi" method="POST"><INPUT
type="hidden" name="to" value="mailaddress@sample.jp">
<table border="1">
<tbody>
<tr>
<td>名前</td>
<td><input size="30" type="text" name="name"></td>
</tr>
<tr>
<td>メール</td>
<td><input size="30" type="text" name="mail"></td>
</tr>
<tr>
<td>メッセージ</td>
<td><textarea rows="5" cols="30" name="message"></textarea></td>
</tr>
<tr>
<td></td>
<td><input type="submit" value="送信"><input
type="reset" value="リセット"></td>
</tr>
</tbody>
</table>
</form>
<!--ここまで-->
| 名前 | |
| メール | |
| メッセージ | |
送信後の画面
このCGIでは、送信後に「アンケートにご協力誠にありがとうございました。」などと、メールフォームには必要のないコメントが表示されます。このコメントを変更するには、anketo.cgiの変更が必要になります。
anketo.cgiをメモ帳などで開き、下のほうを確認してみると。。。
print "Content-type: text/html\n\n";
print "<HTML><HEAD><TITLE>Thank you!</TITLE></HEAD>\n";
print "<BODY bgcolor=\"#9dffff\">\n";
print "<h4 align=\"center\">アンケートにご協力誠にありがとうございました!</h4>\n";
print "<HR>\n";
print "<P>\n";
print " あなたの貴重な意見を今後のページ作成に役立てたいと考えています。\n";
print "</BODY></HTML>\n";
この部分が送信後表示されるメッセージです。
\ " ; 等の記号やタグ等を削除しないように気をつけて、表示される内容のみ変更します。
ページの背景色は print "<BODY bgcolor=\"#9dffff\">\n"; この部分を変更します。
例えば、背景色を白に変更するときは、 print "<BODY bgcolor=\"#ffffff\">\n"; となります。