Connect any HTML form to systeme.io
Paste your custom HTML page and the native form ID. This tool generates a bridge script that forwards your visitors' input to systeme.io's opt-in form behind the scenes. Your design stays, the leads flow.
Paste HTML above to see detected form fields.
Runs in your browser. Your HTML is never uploaded or stored. The generated script runs on your live page and reads the form structure at load time.
Three steps to a working form.
systeme.io only captures leads through its own native forms. This tool bridges the gap: your visitor fills out your custom form, and the script copies every field into the hidden native form and clicks submit for them.
Add a native form in the editor
Drop a systeme.io opt-in form element onto your page in the editor. It will sit next to your Raw HTML element. Copy its ID from the editor sidebar.
Paste your HTML and the ID here
The tool finds each button and the fields grouped around it, then writes a script that maps every one of your fields to the matching native field.
Paste the output back
Replace your Raw HTML element code with the output. The native form hides itself automatically. Visitors see your design, systeme.io gets the lead.
Straight answers.
In the systeme.io page editor, click the opt-in form element and read its ID from the sidebar. It looks like optinform-36cb97c2. That single ID is all the tool needs. You do not have to open the browser inspector or hunt for the ID of each individual field, because the generated script looks those up itself when the page loads.
The script uses the form ID to find the form in systeme.io's page data, which lists a name for every field it holds: email, first_name, phone, and so on. Your own inputs are paired against those names using their name, type, and autocomplete attributes, and also their placeholder and label wording. An input with type email pairs with the native email field, and a placeholder reading First name pairs with first_name. If the ID lookup ever fails, the script falls back to the first native form on the page so the form keeps working.
The native form must hold at least the fields your custom form collects. If your form asks for a first name and an email, the native form needs a first name field and an email field. Add them on the opt-in element in the editor. Matching happens by field type, so as long as both sides carry the same set, they connect. An email field is required; the tool will not generate a script without one.
Yes. For each button in your HTML, the tool finds the input fields grouped around it and wires that button to send only those fields. A hero form collecting a name and email plus a footer form collecting just an email both work, and both feed the same native form. Fields are scoped to their own form, so two forms reusing the same name attributes will not overwrite each other. The detected forms are listed above the Generate button so you can check the grouping first.
No. The script moves the native form element off screen and shrinks it to a single pixel. It stays in the page so systeme.io's own code and your automations keep working, but visitors cannot see or reach it. The script only ever hides the form element itself, never a parent section, so it cannot blank out your design by accident.
Yes, completely free with no signup, and the tool runs entirely in your browser so your HTML is never uploaded. systeme.io itself is also free to start, with 2,000 contacts and three funnels on the free plan and no credit card required.
Your design. Their email. One script.
Build your landing pages, funnels, courses, and email automations on one platform. Free plan, 2,000 contacts, three funnels. No credit card required.
Start free