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

「Bookstyle」
本文部分が横並びで比較的コンパクトなメールフォームです。
本をイメージして作ったツモリが、出来上がってみたら全く本っぽくない過大広告気味な名前です。
忍者式メールフォーム専用テンプレートです。

>サンプル

サンプルはＨＴＭＬ化してあるのでテストはできません。

背景色などは簡単に変更できます。

このテンプレートは制約が多めです。

• 使用できるのは「名前」「件名」「ＵＲＬ］「メールアドレス」「本文（大）」のみです。その他の項目を使用すると表示が崩れます。
• 使用する項目は本文以外に３つ以上必要です。名前・メール・本文だけとかにするとやっぱり崩れます。
• 表示幅の変更は出来ません。
• 名前・メールアドレス・URL・本文（大）の４つの使用が理想的デス

詳細はダウンロードファイルに同梱の「readme.txt」に記載してあります。
テンプレート使用の際はデザイン選択を「自作CSS」に設定してください。

＊このテンプレートは、メールフォームの管理画面で「メールフォームのタイトル」と「メールフォームの説明文」を使用しない設定（チェックをはずせば使用しない設定になります）にしてお使い頂くと良いかんじです。
ちょっと制約もあって使いにくいかもしれませんが、構造上かなり強引にレイアウトしてあるのでご勘弁を…

ダウンロードは続きからドウゾ～。

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

「シンプルメール・クラフト」
シンプルタイプのメールフォームテンプレートのクラフト紙仕様。
忍者式メールフォーム専用です。

サンプル

サンプルはＨＴＭＬ化してあるのでテストはできません。

表示の幅や背景色など簡単に変更できます。
シンプルメールにクラフト紙を使ってみました。
項目名は画像になっているので、使用できる項目に制限があります。
使用できるのは「名前」「件名」「ＵＲＬ］「メールアドレス」「本文（大）」です。
項目を減らす分には全く問題ありません。（タイトルは使用しない等）
そのほかの項目を使用する場合はプレーンスキンと同様の表示になります。


表示の幅は自由に変更可能です。
スタイルシートの一箇所を変更すれば全体の幅がかわるように作ってあるので簡単にできると思います。詳細はスタイルシートファイル内に記載してあります。

設置方法等も同梱の「readme.txt」に記載してあります。
テンプレート使用の際はデザイン選択を「自作CSS」に設定してください。

＊このテンプレートは、メールフォームの管理画面で「メールフォームのタイトル」と「メールフォームの説明文」を使用しない設定（チェックをはずせば使用しない設定になります）にしてお使い頂くと良いかんじです。

ダウンロードは続きからドウゾ～。

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

「シンプルメール」
シンプルタイプのメールフォームテンプレートです。
忍者式メールフォーム専用です。

サンプル

サンプルはＨＴＭＬ化してあるのでテストはできません。

表示の幅や背景色など簡単に変更できます。
非常に素っ気無いほどシンプルなので色々なＨＰにあわせやすいのではないかと思います。
項目名は画像になっているので、使用できる項目に制限があります。
使用できるのは「名前」「件名」「ＵＲＬ］「メールアドレス」「本文（大）」です。
そのほかの項目を使用する場合はプレーンスキンと同様の表示になります。


表示の幅は自由に変更可能です。
スタイルシートの一箇所を変更すれば全体の幅がかわるように作ってあるので簡単にできると思います。詳細はスタイルシートファイル内に記載してあります。

設置方法等も同梱の「readme.txt」に記載してあります。
テンプレート使用の際はデザイン選択を「自作CSS」に設定してください。

ダウンロードは続きからドウゾ。

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

忍者メールフォームサービス用のテンプレートを突然思い立って作成しました。
（…と言うかやっと構造とついてるクラスＩＤがわかった…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）がフォルダ内に入っていますので、デザインを調節したい部分があればこのスタイルシートをお好みで修正してください。


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