Back
How to add Custom Forms for Framer with FormSpark
Nabeel
Founder @ SegmentUI
Full guide on connecting custom Framer forms aka Superforms to Framer with the free Formspark integration
Copy the SuperForm component
Copy the component from our component library here and paste it to your file
After copying, you can customise the appearance, style, post success behaviour and custom fields. Keep an eye on the name field inside the inputs and this will be your identifier for your form.
Sign up for a Free FormSpark account.
Sign up here. With FormSpark, you can collect 250 submissions for free, get notified via email and connect it to other services via zapier without needing additional backend requirements.
Create a new FormSpark Form
Once you've registered, start by crafting a fresh form on the left-hand side of the dashboard. Click on type as HTML, Add you name and description
Configure Settings
Within that form in FormSpark, navigate to the "How-To" section located at the top. Grab the "submit-form" link from there. Paste this link into the "URL" field found in the component controls of SuperForms. For the configuration settings below the URL, ensure it's set to both "Post" and "JSON."
Configure Input fields & Test
Ensure that you've added required field types with their names properly configure. Once this is done, preview and test out the component You should be able to see the submissions in the submissions tab of your FormSpark form.
