SvelteKit newsletter signup form
A single-field email capture for your mailing list.
Recommended fields
| Field | Type | Required |
|---|---|---|
| Yes |
The code
For SSR + progressive enhancement, create a named action in `+page.server.ts` that reads the form data and forwards it to FormLoom. For SPA-style UX, use `use:enhance` or a plain client `fetch`.
SvelteKit page
src/routes/contact/+page.svelte
<!-- src/routes/contact/+page.svelte -->
<script>
let status = "idle";
async function submit(e) {
e.preventDefault();
const res = await fetch("https://formloom.vercel.app/api/submit/YOUR_ACCESS_KEY", {
method: "POST",
headers: { "Content-Type": "application/json", Accept: "application/json" },
body: JSON.stringify(Object.fromEntries(new FormData(e.target))),
});
status = (await res.json()).success ? "ok" : "error";
}
</script>
{#if status === "ok"}
<p>Thanks — we got your message.</p>
{:else}
<form on:submit={submit}>
<label>
Email
<input type="email" name="email" required />
</label>
<!-- honeypot: bots fill this, humans don't see it -->
<input type="checkbox" name="botcheck" style="display:none" tabindex="-1" autocomplete="off" />
<button type="submit">Send</button>
</form>
{/if}Plain HTML (no JavaScript)
contact.html
<form action="https://formloom.vercel.app/api/submit/YOUR_ACCESS_KEY" method="POST">
<label>
Email
<input type="email" name="email" required />
</label>
<!-- honeypot: bots fill this, humans don't see it -->
<input type="checkbox" name="botcheck" style="display:none" tabindex="-1" autocomplete="off" />
<button type="submit">Send</button>
</form>@formloom/client (typed SDK)
submit.ts
// npm i @formloom/client
import { createForm } from "@formloom/client";
type Contact = {
email: string;
};
const form = createForm<Contact>("YOUR_ACCESS_KEY");
// End-to-end typed: TS errors if you send the wrong shape.
const { success, message } = await form.submit({
email: form.email.value,
});Tips
- Keep it to one field — email only — for the highest conversion.
- Wire an autoresponder to send a welcome / double-opt-in email.
FAQ
Usually not — email-only forms convert best. Collect the name later in your welcome email if you need it.