Adding a lead form to a WordPress site

Your lead form is a snippet of code you paste into your own website, so it sits on your page, in your design, with your wording. This article covers the WordPress side of that: which block to use, the one setting that decides whether it works at all, and what to do when a plugin gets in the way.

Build the form first. Capturing leads with a form covers choosing the fields, wording it in your voice and setting where submissions are emailed. Come back here once you have a form you're happy with.

Copy the snippet from 1pm

1. Go to Leads > Lead Types and open the form you want to embed.
2. Open the Embed code section at the bottom of the page.
3. Click Copy snippet.

The snippet is a few lines: an iframe that loads your form, a small script that sizes it to fit, and a "Powered by 1pm" credit line. Copy all of it.

First, work out which WordPress you have

This decides everything, and the two are easy to confuse.

Self-hosted WordPress (the software, installed on your own hosting, where you can install plugins) takes the snippet as it is. Skip to the next section.

WordPress.com (the hosted service) strips <script> tags out of your pages on its lower plans, so the snippet's sizing script never runs. The form still loads and still captures leads, but it sits at a fixed height with blank space under it. To paste working code you need their Business plan or above. If you're not upgrading, use the link approach at the end of this article instead.

If you're unsure which you have, look at your admin address. A Plugins menu in the sidebar means self-hosted.

Paste it into a Custom HTML block

In the block editor:

1. Edit the page you want the form on.
2. Click the plus to add a block, search for Custom HTML, and add it.
3. Paste the 1pm snippet into the block.
4. Click Preview on the block toolbar to see the form in place, then Update the page.

The block shows raw code until you click Preview, which is normal.

If your site uses the classic editor instead, switch from the Visual tab to the Text tab and paste there. Do not switch back to Visual afterwards. The Visual editor rewrites what it doesn't recognise and will quietly eat the script tag, and sometimes the iframe with it. If that happens, delete what's left and paste the snippet again on the Text tab.

Page builders have their own version of the same thing: the HTML widget in Elementor, the Code module in Divi, the HTML module in Beaver Builder. Any of them work; paste the whole snippet.

If you're not an administrator

WordPress only lets administrators (and editors on a single site) publish unfiltered HTML. If you're an author or contributor, or on a multisite network where only the network admin has the privilege, WordPress will strip the script from your snippet when you save, and often the iframe too.

The symptom is that the code looks right while you're editing and comes back changed after you save. Ask an administrator to paste it, or to grant the privilege.

Check the live page, not the editor

Open the published page in a private browser window. The form should size itself to its content, with no scrollbar inside it and no large gap beneath it.

If you see a gap under the last field, or an inner scrollbar, the sizing script isn't running. On WordPress that's nearly always one of three things:

• A caching or speed plugin minifying, deferring or combining JavaScript. Add the page to that plugin's exclusion list, or turn off JavaScript optimisation for it, and clear the cache.
• A security plugin stripping inline scripts or blocking iframes. Allow the page or the 1pm domain.
• The script stripped on save, per the two sections above.

The form keeps working through all of these. It just stops resizing, so the worst case is a page that looks untidy rather than a lost lead. As a stopgap, set Minimum height under Appearance & behaviour on the lead type to a pixel value close to the form's real height, which gets you a tidy fixed-size form with no script involved.

Make it fit your page

• Background. The form is transparent on purpose, so it takes the colour of whatever your theme puts behind it. The fields and text are designed for a light background.
• Width. The form fills the block it sits in, so a narrow theme content column will make it narrow. For something narrower still, change width:100% in the snippet to a fixed width like width:480px. For something wider, set the block or its container to full width in your theme.

Send people to your own thank-you page

By default the form shows a thank-you message in place of the fields. To send the visitor to a page on your site instead, build the thank-you page in WordPress, copy its address, then paste it into Redirect after submit under Appearance & behaviour on the lead type and save. Leave the page out of your menus so it's only ever reached by someone who submitted, which also makes it a clean place to fire a conversion goal.

If you'd rather not embed at all

Every lead type has its own web address, and the Open in new tab button next to Copy snippet opens it. Copy that address from your browser and use it on a WordPress button or menu link. Leads arrive exactly the same way; the only difference is the visitor leaves your site to fill the form in. This is the answer for a WordPress.com plan that strips scripts, and for a site where you can't get the plugin conflicts sorted quickly.

Test it before you tell anyone

Fill the form in on the live page and send yourself a real lead. Check three things: it arrives in your Leads inbox tagged with the right lead type, the notification email reaches the address you set, and the visitor sees the thank-you message or redirect you expect. Delete the test lead afterwards.

If nothing arrives, check that Form is live is switched on for that lead type. A form that's switched off shows your email address in place of the fields rather than an error.

Related articles

• Capturing leads with a form covers building the form itself: fields, wording, colour and notifications.
• Adding a lead form to a Squarespace site covers the same job on Squarespace.
• Adding a lead form to a Wix site covers the same job on Wix.
• Working the leads inbox covers what to do with submissions once they land.
• Auto-reply to new leads covers answering a lead the moment it arrives.