質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.31%
WordPress

WordPressは、PHPで開発されているオープンソースのブログソフトウェアです。データベース管理システムにはMySQLを用いています。フリーのブログソフトウェアの中では最も人気が高く、PHPとHTMLを使って簡単にテンプレートをカスタマイズすることができます。

Q&A

解決済

1回答

720閲覧

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

non-non

総合スコア17

WordPress

WordPressは、PHPで開発されているオープンソースのブログソフトウェアです。データベース管理システムにはMySQLを用いています。フリーのブログソフトウェアの中では最も人気が高く、PHPとHTMLを使って簡単にテンプレートをカスタマイズすることができます。

0グッド

0クリップ

投稿2023/07/25 06:45

実現したいこと

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の環境下ですと、確認画面までいくこともできないのでしょうか。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

AbeTakashi

2023/07/25 11:04

今回のエラーに限らずですが、まずはApacheもしくはPHPでエラーログが出力されていると思うので、そちらを第一に確認すべきでしょう。 参考) https://www.onamae.com/column/wordpress/4/ エラーの内容を見ても内容が理解できない場合は、一部をマスクするなどして質問文に追記してください。 ただ、補足情報にも書いておられますが、メール送信関連の動作確認に関してはXAMPPのようなローカル開発環境だと難しい場合もあります(細かい調整入れればメール飛ぶとは思いますが、結局は本番環境とことなることになる場合が多く、そこまで根詰めてやる人は少ないかと)。できることなら本番環境に近い環境(Linux上なり、DockerやWSL2などの仮想環境上なり)で動作確認される方がいいかと思います。
guest

回答1

0

自己解決

申し訳ございません。
もう少し詳しく詳細を書いて再投稿いたします。

投稿2023/07/27 08:11

non-non

総合スコア17

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.31%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問