Contact Form 7のバージョンアップで「Contact Form 7 add confirm」の不具合発生。確認画面を出すために「Contact Form 7 Multi-Step Forms」を導入してみた

「Contact Form 7」をバージョン5.4にアップデートして、「Contact Form 7 add confirm」でエラーが発生。
ずっとアップデートのないPluginですし、仕方がないのです。今までありがとう。
ただ、対応策として、下記の記事の通りしたらうまく行きました。

【CF7 v5.4以降に対応】Contact form 7 add confirmの修正方法

ブーンさんありがとうございます。

しかし、「Contact Form 7」今後もアップデートするたびに、上記のように対応できるかは不安。私がよく仕組みをわかっていればいいのだけども……。

そもそもフォームに確認画面なんかいらんのではという主張もよくわかるけど、日本人にはいるんですよね。なので「Contact Form 7 Multi-Step Forms」を導入してみることにしました。

なんか、ややこしいとか難しいとか書いてあったので、警戒してたのですけど、そんなことはなかったですよ。内のブログの「お問い合わせ」にも差し替えてみましたよ。

「Contact Form 7 add confirm」と比べたら、「確認用ページ」とか固定ページで用意する必要があるけど、ざっくり言うと段階分だけ「 Contact Form 7 」でお問い合わせ作って、そのショートコードを埋め込んだページを飛ばし先に指定して、最初のステップに「first step」、最後のステップに「last step」埋め込んだら出来ます。

Contact Form 7 Multi-Step Forms

簡単に「お問い合わせフォーム」→「内容確認ページ」→「サンクスページ」となる設定をしてみます。

１固定ページを用意します。

「お問い合わせフォーム(contact)」「内容確認ページ(confirm)」「サンクスページ(thanks)」を作成します。

２「ContactForm7」に必要なフォームを用意します。

お問い合わせフォームが必要なところ「お問い合わせフォーム」と「内容確認」を「ContactForm7」に作成します。

まずは「お問い合わせフォーム」を作成します。

「新規追加」でデフォルトで表示されるフォームの設定の[submit “送信”]を[submit “次へ”]に変更し、その後multistepを追加します。[multistep]をクリックすると下図が表示されます。

「名前」はデフォルトでもOKだけどわかりやすくするなら何か入れて下さい。

「First Step」は最初のフォームでチェック（今回チェック）

「Last Step」は最後のフォームの時にチェック（確認画面のためのフォームを作ってあとはメールを送ってサンクスページを出すだけというときはチェック。

「Send Email」はメールを送ります。「Last Step」をチェックしたらセットでチェックされる。

「Skip Save」はIf you use Flamingo or CFDB7 to save submissions to the database this prevents saving this form submission.とのこと。FlamingoとかCFDB7などのメールフォームで送信した内容を保存するプラグインを使っているときにここにチェックしたら保存をスキップするということかなぁ。英語だけ読むと逆っぽく解釈するけど「Skip Save」だしわからん（英語の訳、よく逆向きにするから）

「Next Page URL」には次のページのＵＲＬを入れます。この場合は「confirm」ですね。
ここのＵＲＬを間違っていると、次の「confirm」で「previous」のボタンが表示されなくなることがあるようです。正確に。私の場合同じ階層の「confirm」でも「フルＵＲＬ」でもいけたけど、「/confirm/」はだめだったです。

次に「確認ページ用フォーム」を用意します

「フォーム」と言っていいのかはわからないけど。「confirmform」という名前で「ContactForm7」に新規追加。

前のフォームから取得したデータは[multiform “your-name”]という形で表示することができます。
確認後間違っていたら前に戻れるように[previous “戻る”]ボタンを追加。そのまま送信してsendmailするために「submit」そして、[multistep]を追加。multistepは「Last Step」と「Send Email」にチェックを入れ、「Next Page URL」はサンクスページのＵＲＬを入れて下さい。

これで出来上がり。

メールを送るときの設定は「Last_Step」を入れた「confirmform」の設定を使っています（念のため）

結構簡単だと思うんですが、ＵＲＬの入れ方を間違えたら「戻るボタン」が表示しなかったりするので、その辺が注意でしょうか。

メールにデータ添付したいときはどうなるか、また今度やってみようと思います。

最後に、「ContactForm7」の開発者様、「Contact Form 7 Multi-Step Forms」の開発者様、そして、「Contact Form 7 add confirm」の開発者様、ありがとございます。

自分でもPlugin作ってアップしてみようと思うのだけど、なかなか……。予約カレンダーが見れるだけのPluginを。非公式にはもう動いているのだけど、どんな人でも使いやすくと思ったらなかなか進まず。だからほんと労力とかに感謝しかないです。

しかし、いまだに「contact form 7 add confirm 動かない」とかで検索すると、ちゃんと動いていた時代にjavascriptの読み込みとかができてないとかが原因で動かないのでは的ブログが上位に表示されるのが気になりますが……。