レスポンシブ・メールフォームの入力内容確認アドオンについて


こちらのページでダウンロードできるレスポンシブ・メールフォームは「入力内容確認アドオン」を追加することができます。

現在の最新バージョンは2021年9月22日公開の4.0です。
参考ページ:プログラムをアップデートするの際の思想について

更新履歴はこのページの一番下にあります。

標準状態では送信前はブラウザ標準の確認ウインドウが(OK・キャンセルの二択のみ)表示されますが、
アラートウインドウ

このアドオンを追加することによって、入力内容を表示する確認画面を出すことができるようになります。
入力内容の確認画面
ブラウザ標準の確認ウインドウとは違い、このウインドウはプログラム設置者がCSSで自由にデザインを変えることができます。(上画像は初期状態のデザイン)

我ながら使い勝手の良いものができたと思っております。ページの移動が発生しないのが素晴らしい。
入力内容の確認画面を出すためにページの移動が発生したらそれだけで少し面倒だし、さらにそれで前のページに戻った時に入力したものが消えてたりしたら、私ならもう問い合わせするのをやめてページを閉じます。

もちろんこのアドオンでは確認画面から前のページ(フォーム入力)に戻ったとしても、入力した内容は消えません。

この「入力内容確認アドオン」の主な機能や特長は以下のようになっています。

  • 入力内容の確認画面を表示するためにページの移動なし。
  • 入力内容の確認画面はCSSで自由にデザイン変更可能。
  • 入力内容の確認画面を表示する際には、自動的にメールフォーム最上部までスクロール。(表示領域の狭いスマホなどで便利)
  • 入力内容の確認画面で「戻る」を押した際に、メールフォーム最上部まで自動でスクロール。(表示領域の狭いスマホなどで便利)
  • 入力内容の確認画面で「戻る」を押した際に、入力していた内容は消えていない。
  • XSS脆弱性の対策済み。
  • 設定ファイルでブラウザ標準の確認ウインドウといつでも切り替えることが可能。
  • アドオン関連ファイルをまとめてaddonフォルダに入れ、index.htmlを差し替えるだけでOK。
    (すでに既存サイトに組み込んでいる場合などindex.htmlを差し替えたくない場合は、HTMLを数行追記するだけでOKです)
  • 他のアドオンと併用可能。

入力内容確認アドオン付きのメールフォームのサンプル
これはサンプルですので自由にメール送信しても問題ありません。

説明
このアドオンの設置は非常に簡単です。

設置方法に関しては同梱されている「入力内容確認アドオンの設置手順.txt」にも記載されていますが、それと同じ内容を以下のページで公開していますので、購入前の方は参考にどうぞ。
入力内容確認アドオンの設置手順の解説

アドオン設置後にこの確認画面のカスタマイズをしたい場合は、以下のページでカスタマイズ方法を解説していますので、既存サイトにデザインを合わせたりする際には参考にしてください。
メールフォームの入力内容確認アドオンのカスタマイズ方法の解説

レスポンシブ・メールフォームにはこれの他にも色々なアドオン(追加機能)がありますが、すべて併用することが可能です。
必要な機能だけを組み合わせてお使いください。

一例として「添付ファイルアドオン」と併用した場合のサンプルはこちら。
画像ファイル選択時にプレビューが表示され、確認画面にもプレビュー画像が表示されます。
入力内容確認アドオンと添付ファイルアドオンとの併用のサンプル

電卓
価格は5,000円(税抜)となります。
設置メールサポートも付いております。

【注意点】
設置メールサポートは「アドオンの設置」に関しての質問のみとなります。
ですので、アドオンなしの初期状態のメールフォームが正常動作している上でご購入ください。

設置方法の詳細に関しては、入力内容確認アドオンの設置手順の解説ページをご覧ください。
また、カスタマイズに関してのご質問は有償メールサポートを別途お申し込みください。

ご購入は以下からどうぞ。
ペイパルと銀行振込でのお支払いの場合は、料金のお支払いをしていただき、その入金確認後にメールで添付にてお送りする形となります。
それ以外のクレジット決済の場合は、お支払い後にすぐダウンロードができますのでお急ぎの方にはおすすめです。

【レスポンシブ・メールフォームの入力内容確認アドオンのご購入】
ペイパルでお支払い
お問い合わせページからお申込み(銀行振込)
STORESでご購入(クレジットカード・コンビニ決済) (決済後ダウンロード可能)
このサイトでご購入(クレジットカード決済) (決済後ダウンロード可能)

【クレジット決済の注意点】
上記のペイパルと銀行振込以外の場合は、お支払後にアドオンファイルをすぐにダウンロードできます。

このサイトでのクレジット購入の場合は、入力必須な項目を最低限としている分、ダウンロードはそのセッション中(ブラウザを閉じるまで・または24分以内)にのみ可能となります。
再ダウンロードしたい場合は、お問い合わせページからご連絡くだされば、本人確認後にメール添付にてお送りいたします。

注意
このアドオンは現時点では通常版のバージョン4.0以降にのみ対応しています
それ未満のバージョンであったり、WordPressプラグイン版のほうには対応しておりませんので、ご注意ください。

  • メールフォーム本体のバージョンは「version.php」または「mailform.php」のファイルの冒頭に書いてあります。
  • 各アドオンのバージョンに関しては、アドオンフォルダの中にある「version.php」、または「アドオン名-config.php」に記載してあります。

また、カスタマイズをしていないのにプログラム上のバグ(不具合)があった場合には、追加料金なしでバグ修正を行いますので、そのような際にもご連絡ください。
(お客様の手によってJavaScriptファイルやPHPファイルを独自カスタマイズされている場合は除く)

2017/03/9 バージョン1.0
  • 公開。
2017/03/28 バージョン1.1 (本体4.1~4.1.2で動作確認済)
  • テキストエリア内の改行が確認画面に反映されない点を修正。
  • 軽微なバグ修正。
2017/04/11 バージョン1.2 (本体5.0~5.4で動作確認済)
  • メールフォーム本体側がアップデートされたことに合わせて修正。
2017/04/18 バージョン1.2.1 (本体5.0~5.4で動作確認済)
2017/08/28 バージョン1.3 (本体5.0~5.4で動作確認済)
  • フォームの項目名や選択項目に「,(半角コンマ)」があったときに起きる不具合を修正。
2017/12/14 バージョン2.0 (本体6.0~6.1.1で動作確認済。これ以降は本体5.*とは互換性がありません)
  • メールフォーム本体側がアップデートされたことに合わせて修正。
2018/04/12 バージョン2.1 (本体6.0~6.1.1で動作確認済)
  • 軽微なバグ修正。
2018/06/09 バージョン2.2 (本体6.2で動作確認済)
  • 添付ファイルアドオンがアップデートされたのに伴って修正。
2018/08/13 バージョン3.0 (本体7.0~7.2.1で動作確認済。これ以降は本体6.*とは互換性がありません)
  • 添付ファイルアドオンと併用した際に、確認画面にもプレビュー画像が表示されるようになりました。
  • 確認画面用のHTMLタグが存在しない場合にエラーを表示するように修正。
2019/01/17 バージョン3.1 (本体7.1~7.2.1で動作確認済)
  • タブレットでの表示を整えるため、レスポンシブのブレイクポイントを640pxから1000pxに変更。
    (本体バージョンが7.0でも正常動作はしますが、タブレットでの確認画面表示がズレます)
2019/09/26 バージョン3.2 (本体7.1~7.2.1で動作確認済)
  • メールフォーム本体のCSSが少し変更されたため、確認画面のCSSもそれに合わせて変更。
    (CSSでのデザイン変更だけなので、前バージョンと機能面での違いはありません)
2021/09/22 バージョン4.0 (本体8.0~以降で動作確認済。これ以降は本体7.*とは互換性がありません)
  • CSSで様々なデザインに調整しやすくなるよう、確認ウインドウに表示する各項目(dt,dd)をすべてそれぞれdlで分離しました。
  • スクロール量設定アドオンに対応。
  • その他、軽微なバグ修正。
提供サポートなど