How to Build a Multi-Step Contact Funnel with Prefilled Data in Contact Form 7 + Dynamic Text Extension (DTX)

By /

Last updated: April 10, 2025

Want to streamline a multi-step workflow without heavy plugins or bloated CRMs? Here’s a use case: You run a strategic intake process for product validation. In Step 1, users submit basic info. In Step 2, they land on a deeper questionnaire—pre-filled with their details—where you qualify leads, scope pain points, and capture context without asking the same thing twice.

Why Use This Approach?

You might use this multi-step, prefilled form approach to streamline the user journey while capturing deeper insights without overwhelming visitors right away. By asking only for basic details upfront, you lower the barrier to entry and make the interaction feel lightweight. Then, on the second step, you can qualify the lead with more detailed questions—without making them repeat information. Importantly, because the initial form submission captures key data like name and email, you still retain the lead even if they abandon the longer form. This gives you the option to follow up manually, enroll them in a nurturing sequence, or pass the data into your CRM or marketing automation system—ensuring that partially completed funnels still generate valuable opportunities.

This guide walks you through building that lightweight intake flow using only Contact Form 7 (CF7), Dynamic Text Extension (DTX), and a splash of JavaScript. It’s simple, scalable, and surprisingly powerful.

🔧 Tools You’ll Need

  • Contact Form 7 (by Takayuki Miyoshi)
  • Contact Form 7 – Dynamic Text Extension (DTX)
  • (Optional but helpful): WPCode or similar custom JS injection plugin
  • (Optional): PowerCache or similar caching plugin

🧠 What You’re Building

  • Form 1 (Quick Intake): Captures first name, last name, email, and company.
  • Form 2 (Detailed Questionnaire): Loads after Form 1 submits and pre-fills the user’s info.

✍️ Step 1: Create the Short Form (Form 1)

Use Contact Form 7 to create your short form. Use regular CF7 fields:

<label>First Name (required)
[text* first-name placeholder "e.g., Jane"]
</label>

<label>Last Name (required)
[text* last-name placeholder "e.g., Doe"]
</label>

<label>Your Email (required)
[email* your-email placeholder "e.g., [email protected]"]
</label>

<label>Company Name
[text your-company placeholder "e.g., Acme Inc."]
</label>

[submit "Continue"]

📬 Email Template (Form 1)

To: [email protected]
From: [first-name] [last-name] <[your-email]>
Subject: 🔎 New Prospect Intake — [first-name] [last-name]

You’ve got a new potential prospect coming in.

🧠 Name: [first-name] [last-name]
📧 Email: [your-email]
🏢 Company: [your-company]

--
This message was submitted from [_site_title] ([_site_url])

🔁 Step 2: Add Redirect JS (NOT in Additional Settings)

❗ Important: Do NOT put JavaScript in the CF7 “Additional Settings” tab. That feature no longer supports raw JavaScript. Instead, inject your custom script using a plugin like WPCode or include it in your theme header/footer.

Paste this working redirect script into your theme’s footer or WPCode:

<script>
// 🔁 Wait for the Contact Form 7 submission to complete
document.addEventListener('wpcf7mailsent', function(event) {

  // 🎯 Grab the form that triggered the event
  const form = event.target;

  // 🧲 Extract form field values safely using optional chaining
  const firstName = form.querySelector('[name="first-name"]')?.value || '';
  const lastName  = form.querySelector('[name="last-name"]')?.value || '';
  const email     = form.querySelector('[name="your-email"]')?.value || '';
  const company   = form.querySelector('[name="your-company"]')?.value || '';

  // 🧪 Build a query string from the captured values
  const params = new URLSearchParams({
    'first_name': firstName,
    'last_name': lastName,
    'email': email,
    'company': company
  });

  // 🚀 Redirect only if the submitted form matches one of these IDs
  // Replace 12345 and 67890 with your actual Form 1 and Form 2 IDs
  if (event.detail.contactFormId === 12345 || event.detail.contactFormId === 67890) {
    window.location.href = "https://example.com.com/full-form/?" + params.toString();
  }

}, false);
</script>

🔍 How to Find the Correct contactFormId for both forms

  1. View the page where the form is embedded.
  2. Inspect the page source and search for: wpcf7-f.
  3. You’ll see something like: wpcf7-f12345-p123-o1 → the number after f is your form ID.

🧾 Step 3: Create the Full Request Form (Form 2)

Use the Dynamic Text Extension tag generator (this is critical!) when creating these fields. Don’t hand-type them.

For example, if you were collecting just the basics on the first form, you could use these fields:

[dynamic_text* first-name placeholder:First%20Name "CF7_GET key='first_name'"]
[dynamic_text* last-name placeholder:Last%20Name "CF7_GET key='last_name'"]
[dynamic_email* your-email placeholder:Email "CF7_GET key='email'"]
[dynamic_text* your-company placeholder:Company "CF7_GET key='company'"]

✅ Important: Using the DTX tag generator inside CF7 ensures that the field syntax is valid. Don’t copy-paste raw shortcodes—always generate them.

Then continue building the rest of the form:

[url user-site placeholder "Product or Website URL"]

<p>Which asset would you like feedback on? (required)</p>
[checkbox* user-assets use_label_element "Landing Page" "Prototype Deck" "Feature List" "Product Pitch" "Other"]

[textarea asset-notes placeholder "Link or context for 'Other'"]
[file asset-upload filetypes:pdf|ppt|docx|jpg|png limit:10mb]

[textarea* user-goal placeholder "What are you trying to accomplish with this asset?"]
[text user-summary placeholder "Describe your product in one sentence"]

<p>What’s the size of your team?</p>
[radio team-size use_label_element "Solo Founder" "2–5" "6–15" "16–50" "51+"]

<p>Who is this for?</p>
[checkbox audience-type use_label_element "Early Adopters" "VCs or Investors" "B2B Customers" "Consumers" "Internal Stakeholders"]

[text industry-tag placeholder "Market or vertical (e.g. fintech, AI, etc.)"]

<p>Where are you in the product journey?</p>
[radio product-stage use_label_element "Idea Phase" "Prototype" "In Beta" "Live with Users" "Pivoting"]

[textarea extra-notes placeholder "Anything weird, wild, or confidential you'd like us to consider?"]

[submit "Request Evaluation"]

📬 Email Template (Form 2)

To: [email protected]
From: [first-name] [last-name] <[your-email]>
Subject: 🚀 Strategic Evaluation Request — [first-name] from [your-company]

A new detailed intake has been submitted.

👤 Name: [first-name] [last-name]
📧 Email: [your-email]
🏢 Company: [your-company]
🔗 Product Link: [user-site]

📎 Requested Review:
Assets: [user-assets]
Other Context: [asset-notes]
Attachment: [asset-upload]

🎯 Goal:
[user-goal]

🧱 One-Line Summary: [user-summary]

👥 Team Size: [team-size]
🎯 Audience: [audience-type]
🏷️ Industry: [industry-tag]
📈 Product Stage: [product-stage]

📝 Additional Notes:
[extra-notes]

-- 
Submitted via [_site_title] ([*_site_url*])

📣 Publish Everything and Test

Once all your pieces are in place—forms configured, dynamic fields tested, redirect logic working—don’t wait for perfection. Push it live. Open a browser, go through the flow like a real user, and stress-test every path. Does the prefill work? Does the email land cleanly? Does the full form behave across devices? Publishing early and testing in the wild is the fastest way to surface edge cases, unexpected errors, or caching conflicts that sandbox previews won’t reveal. You’re not just launching a form—you’re proving the infrastructure for a smarter, more intentional funnel.

🧠 Final Thoughts

This setup gives you a powerful, conversion-optimized workflow without having to reach for expensive funnel builders, heavy marketing platforms, or custom development.

By using Contact Form 7 and Dynamic Text Extension, you’re able to:

  • Collect essential contact info fast (lowering friction)
  • Redirect users to a more detailed form without losing context
  • Prefill fields using clean, URL-based parameter passing
  • Structure complex intake forms while keeping them friendly

Whether you’re a solo consultant, a lean product team, or a brand strategist running symbolic audits, this workflow will make your first touch feel sharp, seamless, and strategic.

And best of all—it’s free, extensible, and fully under your control.

🔁 Rinse, duplicate, adapt.

🧩 Build smarter funnels.

📨 And start every client interaction with signal, not noise.

Related Posts

Scroll to Top