忍者メールフォーム用テンプレート・１

忍者メールフォームサービス用のテンプレートを突然思い立って作成しました。
（…と言うかやっと構造とついてるクラスＩＤがわかった…orz）

発行されるメールフォームのタグを貼り付けるだけで使用できます。
メールフォームにつけたIDで「メールフォームスキンの編集」に表示されるスタイルシート名は変わりますが、一応どんなIDをつけていても大丈夫なはずです。（タブンネ…）

画像はブログの使いまわしですが…
「ブログとおそろい」とでも好意的に解釈して頂けると…（汗）
うさぎポストと同じイメージで作ってあります。
ただし、ブログ用ではなく通常のＨＴＭＬ用です。
＊注意：ブログのサイドバーにこのテンプレートは設置できません。

うさぎポストメール
サンプル

サンプルはＨＴＭＬなので送信テストはできません

「名前」「メールアドレス」「件名」「ＵＲＬ」「本文（大）」
以上の５項目を使う場合に一番キレイに見えるように調節してあります。
その他の項目についても同様の表示になるようにはしてありますが、うさぎの柄が微妙な位置になってしまう予定です…orz

最適化具合
Firefox＞IE＞＞＞Netscape＞Opera
（各ブラウザのフォーム入力部品の高さの都合でどうしても揃えきれない部分があります）

お知らせ。本日２６日１９：００時前までにダウンロードされた方へ。
以下の部分のスタイルシートに間違いがありました。
「default」と名前をつけたメール用の指定が一部混ざってしまっている状態です。
大変お手数ですが、スタイルシートの以下の部分を修正して頂くか、ダウンロードしなおしてやってください、お手数おかけしますー<(_ _)>

このスタイルシートの色のついている部分が不要な指定です。
/*--送信ボタン--*/
div.main div#default_submit input.submit_button {
color: #fff;
margin : 0;
background: #6E464F;
font-weight : bold;
font-size: 10px;
border : 1px solid #6E464F;
width: 80px;
line-height: 100%;
}

こう直して下さい。
/*--送信ボタン--*/
div.main input.submit_button {
color: #fff;
margin : 0;
background: #6E464F;
font-weight : bold;
font-size: 10px;
border : 1px solid #6E464F;
width: 80px;
line-height: 100%;
}

忍者メールフォーム用テンプレートの使い方
一番簡単に設置する方法の場合。
修正＆追加が必要なのは二ヵ所だけです。
使い方を書いたテキストファイルも同梱してあります。

まずは準備。ダウンロードしたデータは圧縮ファイルになっていますので、まずはLhaca等の解凍ソフトを使って圧縮ファイルの解凍をして下さい。
解凍するとフォルダになりますので、その中に入っている「index.html」をテキストエディタなどで開いて下さい。修正作業が必要なのは「index.html」のみです。
テキストエディタはTeraPad等がオススメ。

１．追加する
「この真下に忍者メールフォームのタグを丸ごとコピー＆ペーストしてください」
こう書いてある部分の下に忍者メールフォームで発行されるメールフォームのタグをそのままコピー＆ペーストします。
＊注意：デザイン選択で「自作CSS使用」を選んでタグを発行して下さい。自作CSS以外を選択すると正常に表示できません。

２．修正する
<A href="http://xxxxxx.xx.jp">HOME</A>
下の方にこう書いてある部分があります。
このhttp://xxxxxx.xx.jpの部分を、ホームページのアドレスや、メールフォームから戻らせたいページのアドレスに書きかえて下さい。
戻るリンクが不要な場合は、HTML内に書いてある内容にしたがってその部分を削除することもできます。（削除範囲をHTML内にコメントで書いてあります）

以上の作業が終わったら、フォルダごと自分のホームページスペースにアップロードしてください。
フォルダの中身は分けずに、そのまま同じ場所にアップロードして下さい。

以上で設置作業は完了です。

あとはアップロードしたindex.htmlにブラウザでアクセスして、一応動作確認とかしてみてくださいネ。

装飾は全てスタイルシートで行っています。
スタイルシートファイル（usamail.css）がフォルダ内に入っていますので、デザインを調節したい部分があればこのスタイルシートをお好みで修正してください。


テンプレートのダウンロードは以下追記部分へドウゾ。