Contact Form 7（CF7）のフォームにステップ式の画面遷移と確認画面を追加するには、「Contact Form 7 Multi-Step Forms」プラグインを使います。
このプラグインを使うと、次のことができます。
- フォームを「入力 → 確認 → 送信完了」の複数ステップに分割できる
- 確認画面に入力内容を表示してから送信できる
- 「戻る」ボタンで前のステップに戻れる
この記事では、固定ページの作成からフォームの設定・動作テストまで、手順を順番に解説します。WordPress 7.0 ＋ Contact Form 7 Multi-Step Forms v4.6 で動作確認済み（2026年6月時点）です。
目次
Contact Form 7 Multi-Step Forms とは
「Contact Form 7 Multi-Step Forms」は、Contact Form 7のフォームを複数のステップ（ページ）に分割できる無料プラグインです。
- 有効インストール数：50,000以上
- 最終更新：2026年5月（バージョン4.6）
- 対応WP：4.7以上（7.0テスト済み）
2012年から提供されている実績あるプラグインで、WordPress.org公式ディレクトリから無料でインストールできます。
無料版はフォーム全体で送信できるデータ量が最大4KB（約1,000文字）に制限されています。複数のテキストエリアを設けるフォームでは上限に達することがあります。5MB まで対応する Pro版も提供されています。
プラグインをインストールする
WordPress管理画面の「プラグイン」→「新規プラグインを追加」から Contact Form 7 Multi-Step Forms を検索し、「今すぐインストール」→「有効化」をクリックします。
有効化すると、Contact Form 7のフォーム編集画面にステップ設定用の「multistep」タグが追加されます。
STEP1：各ステップ用の固定ページを作成する
このプラグインでは、各ステップを別々の固定ページに配置します。フォームを設定するときにページURLが必要になるため、先にページを作成しておきます。
今回は次の3ページを作成します。
- 入力ページ（例：お問い合わせ）
- 確認ページ（例：お問い合わせ確認）
- 完了ページ（例：お問い合わせ完了）
「固定ページ」→「新規固定ページを追加」から3つのページを作成してください。それぞれパーマリンクを設定し、公開してURLを控えておきます。完了ページには「送信が完了しました」などのテキストを入力しておきます。
パーマリンクは「下書き」状態では確定しないサーバー環境があります。必ず公開してURLが確定した状態で次のSTEPに進んでください。
STEP2：各ステップのフォームを作成する
Contact Form 7の「新規追加」から、入力フォームと確認フォームの2つを作成します。
- フォームA：入力フォーム（入力ページに配置）
- フォームB：確認フォーム（確認ページに配置）
完了ページにはフォームを配置しません。
入力フォームの設定（フォームA）
「お名前」「メールアドレス」「お問い合わせ内容」など、通常のCF7フォームと同様に入力フィールドを設定します。フォームの末尾に [multistep] タグを追加します。
フォーム編集画面の上部に「multistep」「multiform」「previous」の3つのボタンが追加されています。「multistep」ボタンをクリックするとタグ設定画面が開きます。次の項目を設定してください。
- Name：任意の名前（例：
multistep-1） - First Step：チェックを入れる（このフォームが最初のステップ）
- Next Page URL：確認ページのURL（例：
https://example.com/contact-confirm/）
生成されるタグの例：
[multistep multistep-1 first_step "https://example.com/contact-confirm/"]「送信」ボタンの代わりに「次へ進む」などのラベルを付けたい場合は [submit "次へ進む"] と記述します。フォーム末尾の完成例：
[text your-name placeholder "お名前"]
[email your-email placeholder "メールアドレス"]
[textarea your-message placeholder "お問い合わせ内容"]
[submit "次へ進む"]
[multistep multistep-1 first_step "https://example.com/contact-confirm/"]![Contact Form 7フォームタブ—末尾に[submit]と[multistep first_step]タグが記述された状態](https://rakkoserver.com/plus/wp-content/uploads/2026/06/img03_form_with_tag_v3.jpg)
確認フォームの設定（フォームB）
確認フォームでは、入力フォームで入力した内容を [multiform] タグで表示します。[multiform "フィールド名"] のように、表示したいフィールドの名前を指定します。
確認フォームの記述例：
お名前：[multiform "your-name"]
メール：[multiform "your-email"]
内容：[multiform "your-message"]
[previous "入力画面に戻る"]
[submit "この内容で送信する"]
[multistep multistep-2 last_step send_email]各タグの役割：
[multiform "フィールド名"]：前のステップで入力した値を表示する（フォームタブのみ使用可）[previous "ラベル"]：前のステップ（入力画面）に戻るボタン[multistep multistep-2 last_step send_email]：このフォームが最後のステップで、送信時にメールを送信する
メール送信の設定（送信先アドレス・件名・本文など）は、確認フォーム（フォームB）の「メール」タブで設定してください。send_email オプションが付いているフォームのメール設定が実際に送信に使われます。入力フォーム（フォームA）のメール設定は使われません。
[multiform] タグはフォームタブのみで使用できます。確認フォームのメールタブで [multiform "your-name"] と書いても値が取得できません。メールタブでは通常のCF7タグ（例：[your-name]）をそのまま使用してください。
STEP3：固定ページにショートコードを配置する
作成した固定ページに、対応するフォームのショートコードを貼り付けます。
- 入力ページ → フォームA（入力フォーム）のショートコードを貼り付ける
- 確認ページ → フォームB（確認フォーム）のショートコードを貼り付ける
ショートコードはContact Form 7の一覧画面（「お問い合わせ」→「コンタクトフォーム」）で確認できます。各フォームの行に ショートコード が表示されているので、コピーして固定ページに貼り付けます。
固定ページにショートコードを貼り付けても「コンタクトフォームが見つかりません」と表示される場合は、以下を確認してください。
- ショートコードの ID が正しいか（フォームを保存し直すとIDが変わることがある）
- フォームが削除されていないか（一覧画面で該当フォームが存在するか確認）
- ショートコードを貼り付けた後に固定ページを更新（保存）したか
Contact Form 7の一覧画面で各フォームの行に表示されているショートコードをコピーし直して貼り付けると解消することがほとんどです。
STEP4：送信テストを実施する
入力ページを開き、フォームに内容を入力して「次へ進む」をクリックします。確認ページに入力内容が正しく表示されるか確認してください。
「この内容で送信する」をクリックして送信を完了させ、以下を確認します。
- 管理者宛のメールが届いているか
- 自動返信メールが届いているか（設定している場合）
- 完了ページに正しく遷移するか
動作確認が取れたら、完了ページのテキストを「お問い合わせいただきありがとうございます。内容を確認のうえ、3営業日以内にご返信いたします。」など、実際の文言に更新しておきましょう。
注意事項とよくあるトラブル
キャッシュが有効だと他人の入力内容が表示される
サーバー側のキャッシュ機能が有効な環境でこのプラグインを使うと、別ユーザーが入力した内容が表示されてしまうことがあります。このプラグインはCookieでフォームデータを一時保持する仕組みのため、キャッシュと相性が悪いことが原因です。
プラグインを有効化したら、必ずキャッシュプラグイン（W3 Total Cache・WP Super Cacheなど）やサーバー側のキャッシュ設定で、お問い合わせ関連ページをキャッシュ対象から除外してください。
無料版は4KBのデータ制限がある
無料版は全ステップのフォームデータをCookieに保存するため、送信できるデータ量の上限が4KB（約1,000文字）です。テキストエリアに長文を入力するフォームの場合、上限を超えてデータが欠落することがあります。
長文の入力が想定される場合は、テキストエリアに maxlength:800 などの制限を設けるか、Pro版を検討してください。
「次へ」ボタンを押しても遷移しない
次のページへ遷移しない場合、以下の点を確認してください。
[multistep]タグがフォームの末尾に正しく挿入されているかNext Page URLに設定したURLが公開済みページのURLか（スラッグのみの指定はNG。https://から始まるフルURLで指定する）- CF7の必須フィールドにバリデーションエラーが出ていないか（エラーがあると次のページに進めない）
- JavaScriptのエラーが出ていないか（ブラウザの開発者ツールのコンソールで確認）
よくある質問
無料で使えますか？
はい、無料で使えます。ただし無料版は送信できるデータ量が最大4KB（約1,000文字）に制限されています。フォームの合計入力量がこの上限を超えると、データが欠落する場合があります。長文の入力が想定される場合はPro版を検討してください。
確認画面に入力内容を表示するにはどうすればよいですか？
確認フォーム（フォームB）の「フォーム」タブで [multiform "フィールド名"] タグを使います。例えば名前フィールドを表示したい場合は [multiform "your-name"] と記述します。メールタブでは使用できない点に注意してください。メールの本文には通常のCF7タグ（[your-name]）を使用します。
ステップを3つ以上に増やせますか？
はい、3つ以上のステップにも対応しています。固定ページとフォームの数を増やし、各フォームの [multistep] タグで次のページURLを正しく設定することで実現できます。最初のフォームには first_step、最後のフォームには last_step send_email、中間のフォームにはいずれも付けずにURLだけを指定します。ただし、ステップが増えるほど合計データ量が無料版の4KB制限に近づくため注意が必要です。
Pro版との違いは何ですか？
無料版とPro版の主な違いは次のとおりです。
- データ容量：無料版 4KB ／ Pro版 5MB
- 条件付きステップスキップ：Pro版のみ対応（特定の入力内容によってステップを飛ばせる）
- セッションストレージ：Pro版はCookieではなくセッションストレージを使用するため、容量が大幅に増加
Contact Form 7 Multi-Step Forms に不具合はありますか？
よく報告されているのは「キャッシュが有効な環境で他ユーザーの入力内容が表示される」問題です。これはプラグインのバグではなく、Cookieを使ったデータ保持方式とサーバーキャッシュの相性が原因です。お問い合わせ関連ページをキャッシュ対象から除外することで解消できます。また、最近のバージョン（v4.4.4以降）でいくつかの不具合が修正されています。プラグインを常に最新版に保つことが推奨されます。
まとめ
「Contact Form 7 Multi-Step Forms」プラグインを使うと、Contact Form 7のフォームに入力確認画面と複数ステップの遷移を追加できます。設定の流れをおさらいすると：
- 入力・確認・完了の3つの固定ページを作成して公開する
- 入力フォーム（フォームA）に
[multistep first_step "確認ページURL"]を追加する - 確認フォーム（フォームB）に
[multiform]・[previous]・[multistep last_step send_email]を追加する - 各ページに対応するフォームのショートコードを貼り付ける
- キャッシュプラグインのお問い合わせページ除外設定を忘れずに行う
無料版は4KBのデータ制限があります。長文フォームを想定している場合はPro版も選択肢に入れてください。
