> ## Documentation Index
> Fetch the complete documentation index at: https://help.pipelime.ai/llms.txt
> Use this file to discover all available pages before exploring further.

# Connect the forms on your website

> Scan your site, map the fields, choose your settings and install the source, so its form submissions arrive as leads.

export const UiPath = ({children}) => {
  const parts = String(children).split(/\s*(?:→|>)\s*/).filter(Boolean);
  return <span className="pl-path">
      {parts.map((part, index) => <span key={`${index}-${part}`}>
          {index > 0 && <span className="pl-path__sep">→</span>}
          {part}
        </span>)}
    </span>;
};

export const Screenshot = ({id, alt, caption, frame = 'browser', url, marks = [], lang = 'en', workspace = 'northwind-outbound'}) => {
  const src = `/images/screenshots/${lang}/${id}.png`;
  const chrome = url ? `app.pipelime.ai/${workspace}${url}` : 'app.pipelime.ai';
  return <figure className={`pl-shot pl-shot--${frame} not-prose`}>
      <div className="pl-shot__frame">
        {frame !== 'bare' && <div className="pl-shot__bar">
            <span className="pl-shot__dots">
              <span className="pl-shot__dot" />
              <span className="pl-shot__dot" />
              <span className="pl-shot__dot" />
            </span>
            <span className="pl-shot__url">{chrome}</span>
          </div>}
        <div className="pl-shot__media">
          <img src={src} alt={alt} loading="lazy" />
          {marks.map(mark => <span key={mark.n} className="pl-shot__mark" style={{
    left: `${mark.x}%`,
    top: `${mark.y}%`
  }} aria-hidden="true">
              {mark.n}
            </span>)}
        </div>
      </div>
      {caption && <figcaption className="pl-shot__caption">{caption}</figcaption>}
    </figure>;
};

By the end you'll have a form source connected: its forms found and mapped, its settings chosen, and the install instructions in front of you so its submissions start arriving as leads.

<div className="pl-availability">
  <div className="pl-availability__row">
    <div className="pl-availability__label">Where</div>
    <div className="pl-availability__value"><span className="pl-path">Integrations<span className="pl-path__sep">→</span>Integrations<span className="pl-path__sep">→</span>Web Forms</span></div>
  </div>

  <div className="pl-availability__row">
    <div className="pl-availability__label">Your role needs</div>
    <div className="pl-availability__value">Read access to Web Forms <code>read-web-forms</code>. Admin, Member and Viewer have it by default.</div>
  </div>

  <div className="pl-availability__row">
    <div className="pl-availability__label">To create or change</div>
    <div className="pl-availability__value"><code>create-web-forms</code> to add one, <code>update-web-forms</code> to change one, on top of the permission above.</div>
  </div>

  <div className="pl-availability__note">If you cannot find this in your sidebar, your workspace may have a custom menu configuration. Contact support and we will check it for you.</div>
</div>

<Note>
  Nothing is saved until you leave the Settings step: the scan is stateless, and one request creates the source and
  its forms together. Close the wizard before that and there is no half-made form source to clean up.
</Note>

<Steps>
  <Step title="Open Web Forms and start a source">
    Go to <UiPath>Integrations → Integrations → Web Forms</UiPath> and click **New Form Source**. On a workspace that
    already has a source, that button sits on the banner and again above the list; on a workspace with none, the page
    is a single empty-state prompt carrying the same button. Whichever you click opens the same dialog: a four-step
    wizard, its stepper always showing **Scan**, **Map**, **Settings** and **Install**.
  </Step>

  <Step title="Name it and scan your site">
    Give it a **Name**, just a label for your own reference, and a **Website URL**: the page whose forms you want
    tracked. As soon as the URL is valid, a chip below it shows the domain parsed out of it, next to a line saying
    that forms on this domain report to this source. The source is scoped to that domain, not to the single page
    you typed.

    Click **Scan my site**. This is a real fetch of that page, JavaScript rendering included on sites that need
    it, so give it a moment: a line of status text rotates while it runs, and if it goes on for a while a line
    about JavaScript rendering taking a couple of minutes on dynamic sites joins the rotation.

    <Screenshot id="finding-leads/web-forms-connect--scan" frame="bare" alt="The wizard's Scan step with three detected forms listed as cards, each showing its field chips: a contact form, a one-field newsletter signup, and a longer demo-request form whose extra fields collapse into a small overflow chip. All three are preselected with a checkmark." caption="Every field chip carries a small icon for its type, and a required field gets a red dot next to its name." />

    Every form it finds starts selected, with a checkbox and its field list; deselect any you don't want to track.
    If it finds nothing (the message it shows names JavaScript-heavy setups, React and Webflow among them, as the
    likely cause), you're not stuck: two buttons under that message skip straight to Settings, one queued up for
    the snippet and one for the endpoint. Both want the Name filled in first, and flag that field instead of
    advancing if it is empty. Both installation methods are on
    [Install methods](/en/finding-leads/web-forms-install-methods).
  </Step>

  <Step title="Map fields to your lead record">
    This step only appears if you kept at least one form selected. Deselect everything on Scan and the wizard
    skips straight to Settings instead.

    Each selected form gets its own card, the first one open, with its fields already matched to a lead attribute
    wherever the wizard can tell what a field is: from an autocomplete hint on the field, its input type, or its
    name. **Continue** stays disabled until every form here has a field mapped to **Email**. A form that doesn't
    gets an amber border and a warning underneath it, because a submission with no email address cannot
    auto-create a lead and waits in the review inbox instead. Everything about the mapping editor itself, and what
    an unmapped field does to a submission, is on
    [Field mapping and the submissions inbox](/en/finding-leads/web-forms-mapping-and-submissions).
  </Step>

  <Step title="Configure settings and create">
    **Tags** is optional: pick or create one, and every lead and company this source produces is tagged with it
    automatically.

    **Auto-create leads** is on by default: valid submissions become leads automatically, and only unmapped or
    suspicious ones wait for your review. Turn it off and every submission waits in the review inbox until you
    approve it. **Notify on new submissions**, also on by default, sends an in-app notification every time a
    submission arrives from this source.

    <Screenshot id="finding-leads/web-forms-connect--settings" frame="bare" alt="The wizard's Settings step: an optional Tags field, the Auto-create leads and Notify on new submissions toggles both switched on, and a green Ready to create summary naming the source, its domain, and how many forms will start tracking" caption="Both toggles default on. Turn Auto-create leads off and nothing is lost: submissions wait in the review inbox until you approve them." />

    Click **Create form source**. This is the one call that saves anything: the source, together with whichever
    forms you tracked and how you mapped them, all in a single request. If it fails, you stay on this step with
    everything you set still in place.
  </Step>

  <Step title="Install">
    A successful create takes you straight to the wizard's last step, which names your new source, says it is
    ready, and carries the install instructions. Click **Go to form source** to open the source's own page, or
    **Done** to close the wizard: closing it here is what finishes the source, not what abandons it.
  </Step>
</Steps>

## What happens next

<Check>
  A *Form source created successfully* notification appears the moment the create call lands, while you are still
  on the wizard's Install step. Close the wizard and the new source is at the top of the list on Web Forms,
  already loading its own stats.
</Check>

Closing the wizard from Install doesn't just close it: the same install instructions reopen right away in their
own modal, so you're never left hunting for the button on the card you just made. A new source is created active,
so it starts taking submissions as soon as you install it. From the list, its card carries an **Install** icon for
later, plus **Edit** and **Delete** icons for anyone with permission to change or remove sources, next to an
**Active** / **Inactive** switch for the whole source.

<Screenshot id="finding-leads/web-forms-connect--list" url="/web-forms" alt="The Web Forms list: four summary counters, a Daily Submissions chart for the last 7 days, and one Active form source card with its Today, 7d, Leads and Forms counts and a submission trend sparkline" caption="The chart above the list adds every source together. The sparkline on a card is that one source on its own." />

## Troubleshooting

<AccordionGroup>
  <Accordion title="We couldn't find any forms on that page">
    The scanner didn't detect a form element on the URL you gave it. The message it shows blames sites that build
    their forms with JavaScript, naming React and Webflow as examples.

    Use one of the two buttons under the message, **Continue with snippet (recommended)** or **Use direct
    endpoint**. Both skip straight to Settings, and nothing you typed on this step is lost. Once the snippet is
    live on your site, forms on it are discovered automatically and there's no more scanning to do.
  </Accordion>

  <Accordion title="The scan seems to be taking forever">
    A dynamic site goes through a JavaScript-rendering step, which is slower than a plain fetch. That is what the
    rotating status line means when it says rendering can take a couple of minutes on dynamic sites. You are not
    stuck either way: the wizard stops waiting on its own after a while and drops you into the same two fallback
    buttons, so leaving it alone gets you there too.
  </Accordion>

  <Accordion title="Continue won't light up on the Map step">
    One of the selected forms has no field mapped to **Email**, which is what the amber border and the warning
    under that card are pointing at. Open the card and map any field to **Email**, or, if that form genuinely
    doesn't collect one, press **Back** to return to Scan and deselect it instead.
  </Accordion>
</AccordionGroup>

## Related

<CardGroup cols={2}>
  <Card title="Field mapping and the submissions inbox" icon="arrow-left-right" href="/en/finding-leads/web-forms-mapping-and-submissions">
    Track or ignore a form after the fact, remap its fields, and work the submissions it produces.
  </Card>

  <Card title="Install methods: JavaScript snippet or direct endpoint" icon="code" href="/en/finding-leads/web-forms-install-methods">
    The snippet tag, the direct endpoint, and platform guides for Webflow, WordPress, Shopify and more.
  </Card>

  <Card title="Web Forms: capture script and submissions endpoint" icon="webhook" href="/en/developers/web-forms-capture-endpoint">
    Post submissions yourself: the payload shape, the domain check, and every error body.
  </Card>
</CardGroup>