CoPortalDocs

Clients & Leads

Embedding a form on your website

Any intake form you have already built can be dropped straight into your own website — visitors never leave your page, and every submission still lands in your pipeline as a lead. It is one block of code, pasted once.

Get your code

  1. 1Open Settings → Intake forms.
  2. 2Pick the form you want to embed from the row of forms at the top.
  3. 3Find the Put this form on your website card and press Copy code.

What you get looks like this, with your own form's id in place of the zeros:

<script async src="https://coportal.io/embed.js" data-coportal-form="00000000-0000-0000-0000-000000000000"></script>
<noscript><a href="https://coportal.io/intake/00000000-0000-0000-0000-000000000000">Open the enquiry form</a></noscript>

The first line does everything — it loads the form and marks the spot, so the form appears exactly where you paste it. The second line is a plain link shown only to the rare visitor browsing with JavaScript switched off, so nobody hits a blank space. You can drop that line if your builder refuses it, but there is no reason to.

Paste it as-is. Nothing in it needs editing, there is no key to generate, and the same two lines work on every site and every page.

Tip: Use the Show preview button on that same card before you paste anything. It renders the live form so you can check the wording and field order first.

Squarespace

Squarespace calls this a Code Block. Edit the page you want the form on, add a new block where the form should sit, and choose the code option from the block menu (searching the block picker for “code” is the quickest way to find it). Paste the snippet in, replacing the sample markup Squarespace pre-fills, then save and publish.

  • Leave the block's language setting on HTML — not Markdown.
  • If the block offers a “display source code” toggle, leave it off. On, it prints your snippet as text instead of running it.
  • The form usually will not render inside the Squarespace editor itself. Save and view the live page to check it.
Heads up: Squarespace restricts code blocks on its entry-level plan. If you cannot find the code block at all, that is almost certainly why — check what your Squarespace plan includes before spending time hunting for the menu. In the meantime you can link to your hosted form page instead, which works on every plan.

Webflow

In the Webflow Designer, add an Embedelement (Webflow's HTML embed component) from the elements / add panel, drop it where the form should appear, and paste the snippet into the code editor that opens. Save the embed, then publish the site.

  • Webflow does not run embedded scripts on the Designer canvas — you will see a placeholder box there. That is expected; check the published site.
  • Give the embed element full width in the layout, otherwise the form is squeezed into whatever width the parent gives it.
  • Prefer the embed element over site-wide custom code. Site-wide code loads the script on every page, including ones with no form on them.

WordPress

On the modern block editor, add a Custom HTML block where you want the form and paste the snippet into it. On the older classic editor, switch the editor from Visual to Text and paste it there. Update the page.

  • Use the block editor's Preview on the live page rather than the editor pane — the editor often shows the raw code instead of the form.
  • WordPress only lets certain user roles publish script tags. If the snippet appears as visible text on the page, or vanishes on save, you are likely editing as a role that cannot post raw HTML — publish it from an administrator account.
  • Some security and caching plugins strip or defer scripts. If the form does not appear, temporarily disable those to confirm before looking anywhere else.

Anywhere else

The snippet is ordinary HTML with no dependencies, so it works in any builder that gives you an HTML, embed or “custom code” area — Shopify pages, Wix, Framer, Ghost, a hand-written site. Paste it where you want the form to appear. There is nothing to register and no key to generate.

You can embed the same form on several pages, and different forms on different pages. Each block of code is independent.

Restricting which sites can use it

By default the snippet works wherever it is pasted, which is what you want on day one — paste and go. If you would rather it only worked on your own site, add your domain to Sites allowed to show this form on the same settings card, one per line.

  • Enter the bare domain — yoursite.co.za, not https://www.yoursite.co.za/contact. Subdomains of what you enter are included.
  • Add every domain the site actually answers on. A staging domain, or a separate landing-page domain, needs its own line — otherwise the form shows a short “This form isn’t available.” message there instead of loading.
  • Leave it empty unless you have a reason. An empty list is not a security hole — it just means you have not narrowed it.

Seeing where a lead came from

A lead submitted through an embedded form records the page it came from. Open the lead in your pipeline and look at the Details tab — Where this came from shows the exact page URL, and any campaign tags that were on it.

If you send paid traffic to a page with a form on it, add the usual campaign parameters to your ad links (utm_source, utm_medium, utm_campaign). They are picked up automatically, so you can tell which campaign produced which lead without tagging anything by hand. Google Ads and Meta click ids are recognised too.

Tip: Embedding the same form on two pages — say your homepage and a paid landing page — is the cheapest way to find out which one actually converts. Same form, same pipeline, and the lead tells you which page it came from.

If the form does not appear

You see the code as text on the page

The builder escaped it instead of running it. Look for a "display as code" or "show source" toggle on the block, or a Visual / Text editor switch, and make sure you are pasting into the HTML side.

Nothing appears at all

Check the form is toggled on in Settings → Intake forms. An inactive form does not render.

It works on one page but not another

Almost always the domain list. If the two pages are on different domains, add both.

It works on yoursite.co.za but not www.yoursite.co.za

Enter the domain without the www — that covers both.

The form says it is not available on my own site

The page’s domain is not on the form’s Sites-allowed list. Add it — including any staging or landing-page domain — or clear the list to allow every site.

It only breaks in the site editor

Most builders do not run embedded scripts inside their own editor. Publish and check the live page.

Still stuck?

Every form also has a hosted page of its own at coportal.io/intake/your-form-id, shown at the top of the same settings card. Linking a button on your site to that page is a perfectly good fallback and takes seconds — the leads arrive identically.