Wordpressのプラグイン「Contact Form 7」を使用して、 問い合わせ項目の入力→内容確認→送信完了の流れを作成したい

実現したいこと

Wordpressのプラグイン「Contact Form 7」および「Contact Form 7 Multi-Step Forms」を使用して、
問い合わせ項目の入力→内容確認→送信完了の流れを作成したいです。

前提

XAMPPで構築したローカル環境内でContact Form 7で作成した問い合わせフォームにMulti-Step Formsで入力内容の確認、送信完了のステップを作成しましたが、
確認画面に映らず、「確認画面へ」ボタンを押すと、赤枠で「メッセージの送信に失敗しました。後でまたお試しください。」と表示されます。

プラグインの使い方を紹介しているサイトを参考に、固定ページで内容確認ページ(page-confirm.php)、送信完了ページ(page-thanks.php)を作成し、Contact Form 7の編集画面から、問い合わせフォーム、問い合わせ内容の確認用フォームを作成しています。

発生している問題・エラーメッセージ

・確認画面に映らず、「確認画面へ」ボタンを押すと、赤枠で「メッセージの送信に失敗しました。後でまたお試しください。」と表示されます。
・確認ページ編集画面内メールタブ 追加ヘッダー部分にReply-To: [mail]と記述していますが、エラーが発生します。

該当のソースコード

問い合わせフォーム

html

1<div class="Form">2 <div class="Form-Item">3 <p class="Form-Item-Label"><span class="Form-Item-Label-Required">必須</span>御社の法人名</p>4 <p class="input_area">[text* company_name class:Form-Item-Input]</p>5 </div>6 <div class="Form-Item">7 <p class="Form-Item-Label"><span class="Form-Item-Label-Required">必須</span>担当者お名前</p>8 <p class="input_area">[text* user-name class:Form-Item-Input]</p>9 </div>10 <div class="Form-Item">11 <p class="Form-Item-Label"><span class="Form-Item-Label-Required">必須</span>メールアドレス</p>12 <p class="input_area">[email* mail class:Form-Item-Input]</p>13 </div>14 <div class="Form-Item">15 <p class="Form-Item-Label isMsg"><span class="Form-Item-Label-Required">必須</span>お問い合わせ内容</p>16 <p class="input_area">[textarea* message class:Form-Item-Textarea]</p>17 </div>18 <div class="checkbox_wrap">19 <p class="privacy">プライバシーポリシーをご確認の上、<br>同意していただける場合はチェックをつけてください。</p>20 <p class="privacy">[checkbox* privacy class:privacy use_label_element "同意する"]</p>21 </div>22 <div class="Btn_wrap">23 [submit class:Form-Btn "確認画面へ"] 24 [multistep multistep-81 first_step "/confirm"] 25 </div>26</div>

確認ページ

html

1<p>以下の内容で送信します。</p>2<div class="Form">3 <div class="Form-Item">4 <p class="Form-Item-Label"><span class="Form-Item-Label-Required">必須</span>御社の法人名</p>5 <p class="input_area">[multiform "company_name"]</p>6 </div>7 <div class="Form-Item">8 <p class="Form-Item-Label"><span class="Form-Item-Label-Required">必須</span>担当者お名前</p>9 <p class="input_area">[multiform "user-name"]</p>10 </div>11 <div class="Form-Item">12 <p class="Form-Item-Label"><span class="Form-Item-Label-Required">必須</span>メールアドレス</p>13 <p class="input_area">[multiform "mail"]</p>14 </div>15 <div class="Form-Item">16 <p class="Form-Item-Label isMsg"><span class="Form-Item-Label-Required">必須</span>お問い合わせ内容</p>17 <p class="input_area">[multiform "message"]</p>18 </div>19 <div class="checkbox_wrap">20 <p class="privacy"><a href="https://www.gzoe.co.jp/privacypolicy.html" target="_blank" rel="noopener noreferrer">プライバシーポリシー</a>をご確認の上、同意していただける場合はチェックをつけてください。</p>21 <p class="privacy">[multiform privacy class:privacy use_label_element "同意する"]</p>22 </div>23 <div class="Btn_wrap">24 [submit class:Form-Btn "送信"] 25 [multistep multistep-724 last_step send_email "/thanks"] 26 [previous class:Form-Btn_fix "戻る"] 27 </div>28</div>

試したこと

プラグインの使い方を紹介しているサイトをいくつか参考にし、手順通り作成しましたが、確認画面まで進むことができませんでした。

補足情報(FW/ツールのバージョンなど)

制作環境は、XAMPPを使用したローカル環境で行っております。
そもそもXAMPPの環境下ですと、確認画面までいくこともできないのでしょうか。

コメントを投稿

0 コメント