Quick Start

Install

CDN (Webflow)

For Webflow’s native success and error states, add this script before </body> in your project:

<script src="https://cdn.jsdelivr.net/npm/@formtress/js@1.0.0/dist/js/webflow.js"></script>

Connect your form

1. Create a form in the dashboard

   Log in to your Formtress dashboard, create a workspace (or use your default one), and add a new form. You’ll see a Form ID at the top of the form page (click it to copy).

2. Set your form’s action

   Set the action attribute to your Formtress submit URL and method to post:

   <form action="https://app.formtress.com/api/f/your-form-id-here" method="post">
     <input type="text" name="name" placeholder="Name" required />
     <input type="email" name="email" placeholder="Email" required />
     <textarea name="message" placeholder="Message"></textarea>
     <button type="submit">
       <span data-ft-loading-text="Sending...">Send</span>
     </button>
   </form>

   Replace your-form-id-here with your actual Form ID.

3. Submit a test

   Open your page, fill in the form, and hit submit. You should see the submission appear in your dashboard immediately.

npm

Install the Formtress package:

npm

npm install @formtress/js

pnpm

pnpm add @formtress/js

yarn

yarn add @formtress/js

bun

bun add @formtress/js

Connect your form

1. Create a form in the dashboard

   Log in to your Formtress dashboard, create a workspace (or use your default one), and add a new form. You’ll see a Form ID at the top of the form page (click it to copy).

2. Set the form action and enhance with JavaScript

   Set the action on your form, then intercept it with submitForm:

   <form id="my-form" action="https://app.formtress.com/api/f/your-form-id-here" method="POST">
     <!-- your fields -->
     <button type="submit">Send</button>
   </form>

   import { submitForm } from '@formtress/js'
   
   const form = document.querySelector('#my-form')
   
   form.addEventListener('submit', async (e) => {
     e.preventDefault()
   
     const result = await submitForm({
       url: form.action,
       data: new FormData(form),
     })
   
     if (result.ok) {
       // Show your own success UI
     } else {
       // Show error state: result.message, result.status
     }
   })

3. Submit a test

   Open your page, fill in the form, and hit submit. You should see the submission appear in your dashboard immediately.

What happens next?

• Webflow users: the script automatically uses Webflow’s native success/error states. See the full Webflow Guide.
• Vanilla JS users: handle success/error in code. See the Vanilla JS Guide.
• Set up integrations: forward submissions to email or webhooks. See Integrations.

Prefer video? Watch the 4-minute walkthrough

Play