ラッコサーバー

ラッコサーバーでサイトを管理すると売却時の価値を高く保てます!
サイト/ドメインの売却をシームレスに実現します。

ラッコサーバー詳細
オンライン事業売買
WordPressサイト売買
ドメイン売買
データを読み込み中...
データを読み込み中...
データを読み込み中...

【WordPress】フォームの入力ミスを防ぐ確認ステップの追加方法(WPForms)

WPFormsで確認画面を追加したい…でも設定を見てもそれらしい機能が見当たらない…

この記事では、WordPressのフォーム作成プラグイン「WPForms(WordPress.org公式)」で送信前の入力ミスを防ぐ方法を解説します。

  • WPForms(無料版)でできること・できないこと(本当の意味の確認画面との違い)
  • 送信前に確認を促すチェックボックスを追加する手順
  • 送信後に表示する確認メッセージを設定する手順
ラッコサーバー

ラッコサーバーでサイトを管理すると売却時の価値を高く保てます!
サイト/ドメインの売却をシームレスに実現します。

ラッコサーバー詳細
オンライン事業売買
WordPressサイト売買
ドメイン売買
データを読み込み中...
データを読み込み中...
データを読み込み中...

WPFormsの「確認」機能でできること・できないこと

設定画面に「確認」タブがあるのに、送信前の確認画面が作れないのはなぜ…?

WPFormsのフォームビルダーには「確認」(Confirmations)というタブがあります。名前だけを見ると送信前の確認画面を設定できそうですが、この「確認」タブはフォームの送信後にユーザーへ表示するメッセージ・ページ・リダイレクト先を設定する機能です。

つまり「確認」タブは、送信が完了した後の案内を決める場所です。送信するに入力内容を一覧表示し、内容を見直したうえで修正・送信できる画面ではありません。

送信前に入力内容を確認できる画面は、WPFormsでは「エントリープレビュー」という名前のフィールドで提供されます。ただしこの「エントリープレビュー」は有料ライセンス限定のフィールドで、無料版(Lite)では利用できません。

そのため無料版では、本格的な確認画面(送信前に内容を編集できる画面)そのものは作れません。この記事では、無料版でも入力ミスを減らせる代替策として、次の2つを設定していきます。

  • 送信前に確認を促すチェックボックスを追加する(STEP1)
  • 送信後に表示する確認メッセージを整える(STEP2)
MEMO

「確認」タブ=送信の案内を設定する場所、「エントリープレビュー」=送信に内容を見直す有料フィールド、と役割が分かれています。名前が似ているので混同しないよう注意しましょう。

WPFormsを準備する(前提条件)

まだWPFormsを導入していない場合は、先にインストールと有効化を済ませます。WordPressの管理画面で左メニューの「プラグイン」→「新規プラグインを追加」をクリックし、右上の検索欄に「WPForms」と入力します。

表示された「WPForms – AI Form Builder for WordPress」(スラッグ: wpforms-lite)の「今すぐインストール」をクリックし、続けて「有効化」をクリックすれば準備は完了です。すでにインストール・有効化済みの場合は、プラグイン一覧に「有効」と表示されます。

プラグイン新規追加画面—WPForms検索結果
▲ 有効化済みのWPForms(「有効」と表示されている)

有効化すると、左メニューに「WPForms」の項目が追加されます。この記事では、すでに作成済みのお問い合わせフォームを編集する前提で手順を進めます。

STEP1:送信前に確認を促すチェックボックスを追加する(無料でできる)

本格的な確認画面は無理でも、入力ミスを減らす工夫なら無料版でもできるよ!

無料版でまず取り入れたいのが、送信前に「内容を確認しました」とユーザー自身にチェックを入れてもらうチェックボックスです。送信ボタンを押す直前にワンクッションを置くことで、うっかり送信による入力ミスを減らせます。

1. フォームにチェックボックスフィールドを追加する

編集したいフォームをフォームビルダーで開きます。左側の「フィールド」パネルを開き、「標準フィールド」の中にある「チェックボックス」を、右側のフォームプレビューの送信ボタンの手前までドラッグ&ドロップします。

WPFormsフィールド追加パネル—標準フィールドのチェックボックス
▲ 「フィールド」パネルの「標準フィールド」にある「チェックボックス」

2. ラベルを確認を促す文言に変更する

追加したチェックボックスフィールドをクリックすると、左側にフィールド設定が表示されます。「ラベル」欄の文言を、「入力内容に誤りがないことを確認しました」のような確認を促す文言に変更します。選択肢のテキスト欄も同様に、確認内容がわかる文言に整えておきます。

WPFormsチェックボックスフィールド設定—ラベル欄
▲ 「ラベル」欄に確認を促す文言を入力する

3. 必須項目にしてフォームを保存する

そのままフィールド設定の中にある「必須」トグルをONにします。必須にしておくと、チェックを入れないと送信できなくなるため、確認ステップとして機能します。最後に画面右上の「保存」ボタンをクリックしてフォームを保存します。

WPFormsフィールド設定—必須トグル
▲ 「必須」をONにすると、プレビューの確認チェックボックスに赤い「*」が付く
チェックボックスを活用するコツ

チェックボックスは「個人情報の取り扱いに同意します」といった同意確認にも使えます。確認と同意を1つのフォームで両立させたい場合は、用途ごとにチェックボックスを分けて追加すると、送信前の確認ポイントが明確になります。

STEP2:送信後に表示する確認メッセージを設定する

送信後に表示するメッセージを整えると、ユーザーが「ちゃんと送れた」と安心できますよ。

送信前のチェックに加えて、送信後の案内も整えておきましょう。ここでは「確認」タブを使って、送信完了後に表示するメッセージを設定します。

1. 「確認」タブを開く

フォームビルダーの左側で「設定」パネルを開きます。サイドバーに「一般」「スパム対策とセキュリティ」「確認」「通知」というタブが並ぶので、「確認」タブをクリックします。

WPFormsフォーム設定パネル—確認タブ
▲ 「設定」パネルのサイドバーにある「確認」タブ

2. 確認タイプを選ぶ

「確認」タブを開くと、「確認タイプ」のドロップダウンがあります。初期状態では「メッセージ」が選択されています。選択肢は次の3種類あり、用途に合わせて選びます。

WPForms確認設定—確認タイプ
▲ 「確認タイプ」は初期状態で「メッセージ」が選択されている
確認タイプ 動作 向いているケース
メッセージ 送信後に同じページ内でお礼などのメッセージを表示する 手軽に完了メッセージを出したいとき
ページを表示 サイト内の指定した固定ページへ移動させる 専用のサンクスページを用意しているとき
URLに移動(リダイレクト) 指定したURL(外部サイトを含む)へ移動させる 外部の完了ページや別サービスへ誘導したいとき

まずは手軽な「メッセージ」を選び、慣れてきたら専用ページへ誘導する「ページを表示」を検討するとよいでしょう。

3. メッセージ内容を編集して保存する

確認タイプで「メッセージ」を選んだ場合は、下に表示される「確認メッセージ」の入力欄に、送信完了を伝える文章を入力します。「お問い合わせありがとうございます。担当者より折り返しご連絡いたします。」のように、次に何が起きるかがわかる文言にすると親切です。編集が終わったら画面右上の「保存」ボタンをクリックして保存します。

WPForms確認設定—確認メッセージ編集
▲ 「確認メッセージ」欄に送信完了を伝える文章を入力する
本格的な確認画面が必要な場合は

送信前に入力内容を一覧表示し、内容を編集してから送信できる本格的な確認画面が必要な場合、WPForms無料版では対応できません(理由は前述の通りです)。

その場合は、確認画面機能を標準で備える他プラグインの利用を検討しましょう。日本語のフォーム作成でよく使われる「MW WP Form」や、「Contact Form 7」+確認画面に対応したアドオンなどが選択肢になります。

よくある質問

WPFormsの無料版(Lite)でも確認画面は作れますか?

送信前に入力内容を編集できる本格的な確認画面(エントリープレビュー)は有料版限定で、無料版では作れません。無料版では確認チェックボックスなどの代替策で入力ミスを減らします。詳しくは「WPFormsの『確認』機能でできること・できないこと」の章をご覧ください。

「確認」タブとエントリープレビューの違いは何ですか?

「確認」タブは送信に表示するメッセージやリダイレクト先を設定する機能で、無料版でも使えます。エントリープレビューは送信に入力内容を一覧表示する有料機能です。詳しくは前述の章をご覧ください。

問い合わせフォームの確認画面にはどんな役割があり、必ず必要ですか?

確認画面は、送信前に入力ミスへ気づけるようにしたり、送信後にユーザーが安心できるようにしたりする役割があります。ただし必須ではありません。項目数が少ないフォームであれば、確認チェックボックスや送信後の確認メッセージといった代替手段で十分な場合が多くあります。

WPFormsの確認メッセージにボタンやリンクを設定できますか?

確認タイプで「ページを表示」を選べばサイト内の固定ページへ、「URLに移動(リダイレクト)」を選べば外部URLを含む任意のページへ移動させられます。完了後に別ページやリンク先へ誘導したい場合は、これらのタイプを選びましょう。

本格的な確認画面(入力内容を編集して送信)が必要な場合はどうすればいいですか?

WPForms有料版のエントリープレビュー機能を使うか、確認画面機能を標準搭載する他プラグインの利用を検討します。日本語フォームでは「MW WP Form」や、「Contact Form 7」+確認画面対応アドオンなどが候補になります。

WPFormsは日本語に対応していますか?

WPFormsの管理画面は日本語表示に対応しています。WordPress本体の表示言語を日本語に設定していれば、フォームビルダーの各項目も日本語で表示されます。

💡 フォームからの問い合わせを確実に届けるなら「ラッコサーバー」

確認チェックボックスや確認メッセージで入力ミスを減らしても、肝心の通知メールが迷惑メールフォルダに振り分けられたり、届かなかったりしては意味がありません。

ラッコサーバーは、SPF/DKIMレコードの設定に対応し、独自ドメインメール・SMTP情報も提供しているため、フォームからの通知メールが迷惑メール判定されにくい環境を用意できます。

WordPressの自動インストールにも対応しており、月額330円(税込)〜から利用可能です。30日間の無料お試し期間中に、実際のメール到達率を確認することもできます。

まとめ

WPForms無料版には、送信前に入力内容を編集できる本格的な確認画面(エントリープレビュー)はありません。これは有料ライセンス限定の機能です。

ただし無料版でも、送信前に確認を促すチェックボックスを追加すれば、うっかり送信による入力ミスを減らせます。あわせて「確認」タブで送信後の確認メッセージを整えれば、ユーザーが安心できるフォームになります。

入力内容を編集して送信する本格的な確認画面がどうしても必要な場合は、WPForms有料版や、確認画面を標準搭載する他プラグインの利用を検討しましょう。まずは無料でできる範囲から、フォームの使いやすさを高めていきましょう。