Help Center

Capturing Leads from Website Forms

* Page referenced in this article: website forms integration page.

LeadCenter can capture submissions from forms that already exist on your website, for example Contact Form 7, Gravity Forms, WPForms, HubSpot, or your own custom HTML, without needing to rebuild the form. The form stays where it is; LeadCenter listens for the submission and creates a contact.

Setup at a Glance

1. Add the LeadCenter JavaScript to your website.
2. Add your domain to LeadCenter.
3. Register the form in LeadCenter using its Form ID or CSS selector.
4. Map form fields to LeadCenter fields.
5. Activate the form.
6. Test it.

Step 1: Add the LeadCenter JavaScript to Your Website

1. Open the Actions menu at the top right of the Website forms integration page.
2. Click Javascript code.
3. Copy the snippet from the dialog and paste it into your website, either in the header or just before </body>, site-wide.

On WordPress, see How to Install LeadCenter JavaScript on WordPress.

Step 2: Add Your Website Domain

1. Open the Actions menu and click Add domain.
2. Enter the domain without http:// or https://, for example contosowealth.com.
3. Save.

Step 3: Register the Form

1. Open the Actions menu and click Register form, or click Register New Form on the empty state.
2. Enter a Form Title.
3. Enter the Form ID, such as #contactForm, or CSS Selector, such as .wpcf7-form, of the form on your site.
4. Optionally set the default Source and Campaign.
5. Save.

Step 4: Map Form Fields to LeadCenter Fields

Mapping tells LeadCenter which input on your form represents which contact field.

1. Open the form's Actions → Fields mapping.
2. For each LeadCenter field (First Name, Last Name, Full Name, Email, Phone, Company, Enquiry, Primary Notes, Address, City, State, Zip, Country, Custom Fields), enter the matching name attribute from your form's HTML.
3. Save.

Example

If your form has <input name="your-email-1"> for the email field, enter your-email-1 in the LeadCenter Email mapping field.

Step 5: Activate the Form

From the form's row, open the Actions menu and confirm the form is active. Verify the exact row action label before publishing if your account shows a different activation control.

Step 6: Test the Capture

1. Open your site in an incognito window.
2. Submit the form with a unique email.
3. Check the Sales Pipeline and the Form Submissions page.
4. Verify the new contact, the Source, and the captured field values.

Best Practices

• Use Form ID rather than CSS Selector when possible. It is the most reliable.
• Always set a default Source on the form so submissions are never Unknown.
• Use UTM parameters in the URLs that drive traffic to the form for accurate paid-channel attribution.
• Map every contact field you collect. Partial mapping leads to incomplete contact records.
• Test after every site change. Theme updates and plugin updates can change form HTML.
• Clear caches after installing or updating the LeadCenter script.

Troubleshooting

If submissions are not being captured, see Troubleshooting: Why Isn't My Form Capturing Leads?.

FAQs

Do I need to change anything on my existing form?

Usually not. If the form has a stable ID or class, you can typically register it as-is.

Will LeadCenter interfere with my form's existing email notifications?

No. LeadCenter listens for the submission. Your form's existing behavior continues unchanged.

Can I capture submissions from multiple forms on the same site?

Yes. Register each form separately with its own ID or selector, default Source, and field mapping.

What if my form is loaded dynamically or uses AJAX?

Most AJAX forms work out of the box. If your form uses a custom submit pattern that LeadCenter doesn't auto-detect, contact support.

Related Articles

• How to Install LeadCenter JavaScript on WordPress
• Troubleshooting: Why Isn't My Form Capturing Leads?
• Form Submissions
• UTM Parameters for Lead Source Attribution
• Where the Source Comes from on an Inbound Lead