Guide
Accept Form Submissions in Under 2 Minutes with Lucid Form
Jul 08, 2024

Accept Form Submissions in Under 2 Minutes with Lucid Form

Setting up form submissions shouldn't be complicated. With Lucid Form, you can start collecting form data on your website in under two minutes — no backend, no frameworks, and no headaches.


Sure! Here’s a full blog post based on your outline for “Accept Form Submissions in Under 2 Minutes with Lucid Form”:


In this guide, we’ll show you how easy it is to connect your HTML form to Lucid Form and start accepting submissions instantly.


🧩 1. The Simplest Integration

To integrate Lucid Form with your website, all you need is a plain HTML form with the correct action and method attributes.

Here’s a basic example:

<form action="https://app.lucidforms.co/s/[form-id]" method="POST">
  <input type="text" name="name" placeholder="Name" />
  <input type="email" name="email" placeholder="Email" />
  <button type="submit">Submit</button>
</form>

💡 Replace [form-id] with your actual form ID from the Lucid Form dashboard.

👉 Important: Make sure your form uses method="POST" — this is required for submissions to work.


🔁 2. Redirect After Submission

Want to redirect users to a “Thank You” page after they submit a form? Just set the redirect URL in your Lucid Form dashboard.

How to Set It Up:

  • Go to your Form Settings
  • Add your custom Redirect URL
  • Save changes

If no redirect URL is set, the form will default to redirecting to:

https://lucidforms.co/success/

⚠️ 3. Handling Errors Gracefully

If a submission fails, the form will redirect to the current page with ?error=true added to the URL.

You can use JavaScript to detect this and show an error message:

const error = new URLSearchParams(window.location.search).get("error");
if (error === "true") {
  // Show an error message to the user
  alert("There was an issue submitting the form. Please try again.");
}

This helps you keep users informed without needing complex error handling.


🧠 4. Adding Custom Data

You can pass custom data along with your form submission using hidden inputs. This is useful for tracking sources, user roles, or tags.

<form action="https://app.lucidforms.co/s/[form-id]" method="POST">
  <input type="text" name="name" placeholder="Name" />
  <input type="email" name="email" placeholder="Email" />
  <input type="hidden" name="source" value="blog-cta" />
  <button type="submit">Submit</button>
</form>

Anything you add will be included in the form submission and visible in your dashboard or webhook payload.


✅ 5. Use Built-In HTML Form Validation

Lucid Form plays nicely with native HTML validation — so you can require fields, check email formats, and more without JavaScript.

<form action="https://app.lucidforms.co/s/[form-id]" method="POST">
  <input type="text" name="name" placeholder="Name" required />
  <input type="email" name="email" placeholder="Email" required />
  <button type="submit">Submit</button>
</form>

Just use the required attribute or any other HTML input rules you need. Clean, fast, and efficient.


🏁 That’s It — You’re Live!

With Lucid Form, you can connect a fully functional contact form in just a few lines of code. No backend, no database, and no form plugins required.

Whether you’re building a landing page, portfolio, or a quick MVP, Lucid Form helps you collect submissions without the friction.


Ready to try it out?
👉 Create your free form on Lucid Form and start accepting submissions in under two minutes.