Lead capturePractical tutorial & starter files12 min read

# Connect your website form to a CRM. Keep the design. Lose the chasing.

Connect an existing website form to a CRM using HTML, a webhook or email. Get copyable examples, match answers and turn each enquiry into a clear callback.

[Find your connection route](https://kibihq.com/resources/articles/connect-website-form-to-crm/#choose-your-form-route) · [Try Kibi CRM](https://kibihq.com/start/?utm_content=website-form-crm-guide)

By [Kibi editorial team](https://kibihq.com/editorial/) · 5 November 2026

In this article

Keep your next enquiry in mind as you read.

Your contact form looks lovely. The email it sends? Somewhere between a client reply, a parcel update and 48 unread newsletters. A promising enquiry deserves a slightly better entrance.

To connect a website form to a CRM, send its submissions to a dedicated CRM address, match the answers to contact and enquiry fields, choose who handles them, then test the visitor confirmation and the team’s follow-up.

You can often keep your existing form. In Kibi, plain HTML can send text fields directly; a builder or automation tool can send a webhook; an email-only form can use a forwarding inbox. We’ll choose a route, then give the enquiry a next call.

[Get the HTML starter and handover checklist](https://kibihq.com/resources/articles/connect-website-form-to-crm/#download-form-starter) · [Using Contact Form 7? Follow the WordPress walkthrough](https://kibihq.com/resources/articles/contact-form-7-crm-integration/)

THE QUICK TAKE

## Key takeaways

- A form builder collects the answers. A CRM helps the team act on them. You do not always need to replace the first to get the second.

- Choose one main delivery route: a supported form connection, webhook or structured enquiry email.

- Keep the visitor’s question, the person handling it and the next call together. A new notification is only the beginning.

- Kibi accepts JSON and ordinary form-encoded text fields at the address shown for your source. The examples below contain no account password or API token.

- Kibi CRM includes a 14-day free trial, then a paid plan. Check sources and team assignment when choosing your plan.

## 1. “Can I keep the form already on my website?”

START WITH YOUR FORM

### Which sounds like your website?

Open a route to see what you need. No redesign required.

01I can edit the HTML

DIRECT POST

#### Keep your fields. Change the destination.

Use your Kibi source address in the form action, send with POST, then match the answers. Add a useful visitor confirmation.

[See the HTML example](https://kibihq.com/resources/articles/connect-website-form-to-crm/#html-form-to-crm)

02My builder has a webhook

JSON WEBHOOK

#### Let the builder send the entry.

Copy the Kibi source address into its webhook destination. Send a sample, check the actual fields and review the connection instructions.

[See the webhook example](https://kibihq.com/resources/articles/connect-website-form-to-crm/#webhook-form-to-crm)

03My form only emails me

EMAIL ROUTE

#### Give the enquiry email a route to Kibi.

Use a forwarding inbox, a visitor Reply-To and clearly labelled answers. Test the email your published form really sends.

[See the email route](https://kibihq.com/resources/articles/connect-website-form-to-crm/#email-only-website-form)

WordPress with Contact Form 7? [Use our dedicated tutorial](https://kibihq.com/resources/articles/contact-form-7-crm-integration/).

Usually, yes—if the form can send its answers somewhere you control. Start with its settings, not a redesign brief. Your carefully chosen button can keep its little moment.

Look for a submission address, webhook, integration or notification-email setting. A webhook lets one tool send a new entry to another automatically. You may also see this called web-to-lead: turning a website submission into a CRM enquiry.

For WordPress with Contact Form 7, our separate tutorial uses Kibi Forms’ existing-form connection. For Framer, a native form’s webhook is a separate setup; the Kibi Forms Marketplace design plugin does not itself connect your CRM.

Choose by what your existing form can send. Builder plan availability is checked in that tool.

| Your form today | Start here | Check before changing it |
| --- | --- | --- |
| Plain HTML that you can edit | POST its text fields to the Kibi source address. | Field names and what visitors see after sending. |
| A builder with a webhook setting | Send the entry to Kibi as JSON. | The actual payload, delivery result and any signing instructions. |
| An automation tool already handling entries | Use its supported POST or HTTP action. | A stable submission ID for retries, where supported. |
| A form that only emails you | Use a Kibi forwarding inbox. | Visitor Reply-To and clearly labelled answers. |

[See Kibi’s website lead capture](https://kibihq.com/features/lead-capture/) · [Framer form design and destination guides](https://kibihq.com/framer-forms/how-it-works/)

## 2. Give this form its own address in Kibi

Open Sources → Add a source → Connect a form you already have. Choose the tool and give the source a name the team will recognise: “Kitchen quote page” beats “Web thing final 2”.

Kibi shows a submission address for that source. Copy it into the form’s supported destination setting. If you are sending JSON from another app, choose the webhook route and follow its instructions instead.

The address uses api.kibihq.com, not the marketing website. Use the whole address Kibi supplies. It identifies this source; you do not need to put your account login or a workspace API token into the form.

Keep the existing connection until you have a safe test ready. If the form already serves paying campaigns, work on a duplicate or staging page first. Then switch one delivery route deliberately.

[Open the Kibi-specific website form setup guide](https://kibihq.com/help/connect-website-form/)

## 3. “How do I connect an HTML form to a CRM?”

Set the form’s action to its Kibi source address and its method to POST. Each answer needs a name, such as fullname, mobile, email or notes. A pretty label alone does not send a field name.

This example collects a name, phone number, optional email and a project question. Replace the source placeholder and privacy link with your own. Keep your site’s styling and add any consent your own form needs.

Ordinary HTML sends these text answers as form-encoded data, which Kibi accepts. This is a text-field example; it does not demonstrate file uploads.

A direct browser submission can show Kibi’s JSON receipt rather than your intended thank-you page. For a friendlier finish, use the downloadable starter’s small script: it stays on the page and shows success only after Kibi confirms the send.

HTML: the fields and destinationHTML

```html
<form id="enquiry-form" method="post"
  action="https://api.kibihq.com/in/REPLACE_WITH_YOUR_SOURCE_SLUG">
  <label>Your name
    <input name="fullname" autocomplete="name" required>
  </label>
  <label>Phone
    <input name="mobile" type="tel" autocomplete="tel" required>
  </label>
  <label>Email (optional)
    <input name="email" type="email" autocomplete="email">
  </label>
  <label>What would you like help with?
    <textarea name="notes" required></textarea>
  </label>
  <p>Read <a href="/privacy/">our privacy notice</a>.</p>
  <button type="submit">Ask for a callback</button>
  <p id="form-result" role="status" aria-live="polite"></p>
</form>
```

Select the code to copy it. On a phone, swipe inside the example to see long lines.

What the visitor should see

“Thanks! Your request has been sent.” Confirm delivery first. If it fails, keep their answers and show a useful retry message. Never clear a thoughtful project brief just because someone pressed Send.

[Download the starter with on-page confirmation](https://kibihq.com/resources/articles/connect-website-form-to-crm/#download-form-starter) · [MDN: how HTML forms send data](https://developer.mozilla.org/en-US/docs/Learn_web_development/Extensions/Forms/Sending_and_retrieving_form_data)

## 4. “My website builder has a webhook. What goes in it?”

Use the Kibi source address as the destination and POST as the method. When the tool asks for a data format, use JSON. The exact field names come from your form; they do not have to match the CRM yet.

Here is the same enquiry as a webhook payload. It is the answers that matter, not whether your builder calls the person fullname, customer_name or something impressively unhelpful like field_7.

If your builder signs deliveries, follow the signing instructions for that connection. If it wraps answers inside a larger object, send a real-shaped sample and review what Kibi receives before assuming the three-line example matches it.

Already using Make or Zapier? Their supported HTTP or webhook action can send the same entry. An extra automation service is a route, not a requirement for the plain HTML example.

JSON: the same fictional enquiryJSON

```json
{
  "fullname": "Sam Example",
  "mobile": "+1 202 555 0108",
  "email": "sam@example.com",
  "notes": "Could we book a call about a kitchen renovation?"
}
```

Select the code to copy it. On a phone, swipe inside the example to see long lines.

[Contact Form 7: use the dedicated connection tutorial](https://kibihq.com/resources/articles/contact-form-7-crm-integration/)

## 5. Match the answers. Keep the actual question.

FIELD MATCHING · ILLUSTRATED EXAMPLE

### Same answers. Useful names.

Your field names can stay. Match what each answer means.

fullnameSam Example

Name

mobile+1 202 555 0108

Phone

emailsam@example.com

Email

notesKitchen renovation. Can we talk?

Message

Why keep the full question?

“Website lead” tells Ravi where it arrived. “Kitchen renovation. Can we talk?” tells him why to call. Save both.

Send one fictional entry so Kibi can see the fields. In the source wizard, review the suggested matches: fullname becomes Name, mobile becomes Phone, email becomes Email, and notes becomes Message. Correct anything the suggestion misunderstood.

Keep the question someone took time to write. “Kitchen renovation, hoping to start in June” tells the caller far more than “Website lead”. Save useful extra answers such as service or city in the appropriate fields.

Use a test name and example.com address, not a customer’s details. Kibi’s wizard sample is marked as a test; it helps with setup and stays out of Today and the numbers.

Then finish setup and make a separate normal fictional submission from the published form. That checks the everyday path. A wizard sample arriving is useful evidence, but it is not the whole handover.

## 6. The enquiry arrived. Who is calling?

FICTIONAL EXAMPLE · YOUR TEAM’S NEXT MOVE

### From “Sent” to “I’ll call Sam.”

- Sam sends the form

“Could we book a call about a kitchen renovation?”

- Ravi handles the enquiry

The question is saved with the website source.

- Ravi plans the callback

Tomorrow · 10am · ask about size, finish and timing.

- Scope agreed? Prepare the quote.

Keep the offer attached to the same enquiry.

Try it with your own form

Tick these as you check your setup. This checklist stays on this page; it sends nothing.

Visitor sees the right confirmation.The question arrives with the contact details.A person is handling the enquiry.A callback has a time and a reason.The team can find the next call.

Sam asks about a kitchen renovation. The entry reaches Kibi, with Sam’s question intact. Now choose the person handling it and plan a callback with a time and a reason.

In our example, Ravi’s next call is tomorrow at 10am: ask about the kitchen size, preferred finish and timing. That is a plan a teammate can understand without a detective hat.

A saved enquiry does not automatically mean someone has booked a call. Your team chooses and saves the follow-up. Today makes that next conversation easier to find; the source’s assignment settings decide who receives new enquiries.

When Sam is ready for an offer, create a quote from the enquiry. The question, conversation and commercial next step stay connected. You get to spend less of the call asking, “Sorry, which form was this?”

Fictional kitchen enquiry

Sam Example → Kitchen quote page → Ravi → call tomorrow at 10am → quote after the scope is agreed. The illustration explains the workflow; it is not a customer result.

[See how Kibi assigns new enquiries](https://kibihq.com/features/routing/) · [Keep the next call visible in Today](https://kibihq.com/features/today/) · [Take the conversation through to a quote](https://kibihq.com/features/quotes-invoices/)

## 7. “My form only sends emails. Can I still use it?”

Yes, an enquiry email can be another route. Add the Kibi forwarding inbox as a notification recipient, or forward those messages from your email account using the relevant setup guide.

Set Reply-To to the visitor’s email and use one clearly labelled answer per line. A message that says Name: Sam, Phone: +1 202 555 0108 and Request: Kitchen renovation is easier to match than a decorative email full of unrelated text.

Test the actual notification, including its Reply-To and answers. If you later add a webhook, check whether both routes are now sending the same enquiry. Two notifications are not twice the love.

[Forward website enquiries through Gmail](https://kibihq.com/help/forward-gmail/) · [Forward website enquiries through Outlook](https://kibihq.com/help/forward-outlook/)

## 8. The five-check test before real enquiries arrive

Test from a phone on the published page. A builder preview can behave differently from the form your customers actually use. Send one normal fictional request after you finish the wizard.

Check five things: the visitor sees confirmation; the enquiry is saved; the answers match; the right person handles it; and a callback can be saved and found. Test a failed send on your development page too.

The downloadable starter disables its button while a request is in progress, checks the reply and keeps the answers if delivery cannot be confirmed. It does not silently keep retrying behind the visitor’s back.

If something looks wrong, check the stage that failed.

| What you notice | What to check next |
| --- | --- |
| Nothing reaches Kibi | The complete source address, active source and the sender’s delivery result. |
| Name or question is missing | The input name and the source’s field matching. |
| Two copies appear | Whether email and webhook routes both send the entry; check retry IDs. |
| The visitor sees raw JSON | The website’s confirmation handling; use the starter or the builder’s success flow. |
| The wizard sample is absent from Today | Test samples are excluded. Check a normal fictional submission and save its next action. |
| A new enquiry has nobody handling it | Source assignment and teammate availability; inspect Unassigned too. |

[Choose a lead distribution method for your team](https://kibihq.com/resources/articles/lead-distribution-methods/)

## Take the starter. Leave the mystery behind.

[Download the HTML form starterEditable text file · HTML plus on-page confirmation · save as .html to try it](https://kibihq.com/downloads/website-form-crm-starter.txt) · [Download the five-check handover checklistA short text checklist for the website person and the sales team](https://kibihq.com/downloads/website-form-crm-checklist.txt)

Download the plain HTML starter if you edit your own site, or give the checklist to the person connecting your builder. The starter includes the form, labels and on-page success or error message; the source address is deliberately a placeholder.

Replace the address, business wording and privacy link, then test it on your development site. It sends text fields only. No tracking code, visitor profiling or private account credentials are added.

Keep the enquiry workflow simple for the first trial: one form, one source, one responsible person and one useful callback. You can make the form more glamorous later. Reliable is rather attractive already.

## A few questions before you connect

Can I connect an existing website form without rebuilding it?

Often, yes. Check whether it supports a submission address, webhook or notification email. In Kibi, choose the supported route, match the fields and test the visitor confirmation as well as the saved enquiry.

Can a plain HTML form send leads directly to Kibi CRM?

Yes. Kibi accepts ordinary form-encoded text fields sent by POST to your source address. Use meaningful input names and match them in Kibi. Add confirmation handling so visitors see a useful success or retry message.

Do I need Zapier to connect a form to a CRM?

Not for Kibi’s direct HTML route. A builder with a supported webhook can send its entry directly too. Make or Zapier may help if another app needs to transform or pass the entry along; check that service’s own plan and capabilities.

What is the difference between a webhook and an enquiry email?

A webhook sends structured answers from one tool to another. An enquiry email sends a message that must be matched to fields. Both can be useful, but choose one main delivery route and check for accidental duplicates.

Can I assign website enquiries to different salespeople?

Yes. Choose who handles the source and review the assignment options. Kibi’s team routing is available on Team and Growth. Check the source settings and availability, then send a fictional enquiry to confirm who receives it.

Does connecting the form automatically schedule a callback?

No. Saving the enquiry and saving its next action are separate steps. Open the enquiry, choose the person handling it and plan the call with a time and reason. Today then helps the team find the follow-up.

Can I add file uploads to this HTML example?

This starter covers text fields, not file uploads. Do not add a file input and assume the same delivery works. Choose a supported upload route and test it separately.

Will this collect ad tracking details automatically?

No. These examples send only the answers shown. Ad-source tracking is a separate setup, with its own consent requirements. A source name identifies the form; it is not proof that an ad created the enquiry.

## A good form starts the conversation. Kibi helps you continue it.

If your website already brings enquiries, start with the part that gets messy: finding the request, deciding who calls and remembering the next conversation. That is the job this connection should make easier.

Kibi’s 14-day free trial lets you try the form-to-follow-up workflow before choosing a paid plan. Compare source allowances on the pricing page; team routing is available on Team and Growth.

Use one real business question during the trial: can the team find a fresh website enquiry, see who is handling it and keep the promised callback? That is a much better first date than another spreadsheet export.

[Try Kibi CRM with your website form](https://kibihq.com/start/?utm_content=website-form-crm-bottom) · [Check current plans for your country](https://kibihq.com/pricing/) · [See the enquiry-to-follow-up product overview](https://kibihq.com/features/lead-capture/)

## References and how to use this guide

The Kibi steps and examples were checked against the current source wizard, field-matching flow and intake contract on 5 November 2026. The kitchen enquiry is fictional. The diagrams are teaching examples, not screenshots or customer evidence.

The HTML reference explains submission mechanics. Your builder’s own documentation controls its webhook settings, signing and plan availability. Use the source instructions Kibi shows for the connection you choose.

[MDN: sending HTML form data](https://developer.mozilla.org/en-US/docs/Learn_web_development/Extensions/Forms/Sending_and_retrieving_form_data) · [Kibi: connect your website form](https://kibihq.com/help/connect-website-form/) · [Kibi editorial standards](https://kibihq.com/editorial/)

Try one thing on the next enquiry.Pick a change your team can use tomorrow.

THE USEFUL SHELF

## Try it in your setup

Follow the steps, then check the result on your site or in your workspace.

Step-by-step Kibi guides

[Setup guideConnect your website formChoose how an existing form sends its enquiries into Kibi.](https://kibihq.com/help/connect-website-form/) · [Feature walkthroughGive an enquiry an ownerExplore routing and team access for shared enquiry work.](https://kibihq.com/features/routing/) · [Feature walkthroughSee how Today keeps follow-up visibleA closer look at the place to find the next action.](https://kibihq.com/features/today/)

KEEP THE THREAD GOING

## Read this next.

[WordPress forms](https://kibihq.com/resources/category/wordpress-forms/)13 min read

Illustrated setup & follow-up guide  21 October 2026 

### [Your form caught the lead. Let’s not lose the hello.](https://kibihq.com/resources/articles/contact-form-7-crm-integration/)

Connect an existing Contact Form 7 form to Kibi CRM. Follow the setup, check a test enquiry and give the next conversation a person and a plan.

[Read the article : Your form caught the lead. Let’s not lose the hello.](https://kibihq.com/resources/articles/contact-form-7-crm-integration/)

[Lead capture](https://kibihq.com/resources/category/lead-capture/)12 min read

Editable templates & a practical walkthrough  22 October 2026 

### [A quote request. Not an interrogation.](https://kibihq.com/resources/articles/service-quote-request-form/)

Three editable quote-request form templates for service businesses, agencies and home-service jobs. Choose useful questions and turn the enquiry into a clear next step.

[Read the article : A quote request. Not an interrogation.](https://kibihq.com/resources/articles/service-quote-request-form/)

[Follow-up & teams](https://kibihq.com/resources/category/follow-up-and-teams/)13 min read

6 copyable messages & a next-move guide 

### [They asked. Then went quiet. Here’s your next hello.](https://kibihq.com/resources/articles/when-an-enquiry-goes-quiet/)

Follow up after no response with six sales messages, a practical timing example and a clear pause-or-stop decision. Keep each enquiry moving with Kibi CRM.

[Read the article : They asked. Then went quiet. Here’s your next hello.](https://kibihq.com/resources/articles/when-an-enquiry-goes-quiet/)

Source: https://kibihq.com/resources/articles/connect-website-form-to-crm/
