Naar hoofdinhoud gaan
Embed een Form om bezoekers direct Records te laten aanmaken in Site.nu. Je website-host moet eerst geverifieerd zijn. Anders blokkeert Site.nu publieke verzoeken vanaf die host.

Overzicht

Een Form moet Live zijn voordat hij publiek laadt. Een draft of gearchiveerd formulier weigert publieke verzoeken. Voeg eerst de exacte website-host toe onder Settings > Domains. example.com en www.example.com zijn verschillende origins en moeten apart geverifieerd worden.

Iframe embed

Plaats deze twee regels op de pagina waar het formulier moet verschijnen:
<div data-sitenu-form="your-workspace/form-id"></div>
<script async src="https://app.site.nu/embed.js"></script>
De waarde van data-sitenu-form is <workspace-slug>/<form-id>. Het script zoekt alle elementen met data-sitenu-form en plaatst er een iframe in. Optionele attributen:
AttribuutGebruik
data-themelight of dark.
data-primary-colorHoofdkleur als hex, rgb of hsl.

Events op de hostpagina

De embed stuurt DOM-events op de container. Gebruik die voor analytics of conversiemeting.
<div id="signup-form" data-sitenu-form="acme/abc-123"></div>
<script>
  document.getElementById("signup-form").addEventListener("sitenuFormSubmitSuccess", (event) => {
    gtag("event", "lead_submitted", { id: event.detail.submissionId });
  });
</script>
Beschikbare events:
EventDetail
sitenuFormLoaded{ formId, name }
sitenuFormSubmitSuccess{ submissionId, recordId, redirectUrl }
sitenuFormSubmitError{ reason, message }
reason kan validation, captcha, rate_limit, origin of server zijn.

Native React-renderer

Gebruik @site-nu/forms-react als je het formulier met eigen markup wilt renderen in een React-app. De hook useSitenuPublicForm haalt de formulierdefinitie op, beheert values en errors, ondersteunt uploads en voert submit() uit. Je rendert zelf controls voor de field types die je gebruikt. Ook bij native rendering moet de website-origin geverifieerd zijn onder Domains.

Domains en Turnstile

Geverifieerde website-hosts bepalen waar Forms mogen laden. Voor native publieke Forms regelt Site.nu Turnstile-bescherming op geverifieerde hosts. Zie je in Network een 200, maar faalt het verzoek toch? Dan blokkeert de browser waarschijnlijk de response. Voeg de exacte host toe onder Settings > Domains en verifieer hem.

FAQ

Controleer of het Form Live is en of de exacte website-host geverifieerd is.
Ja. Luister naar sitenuFormSubmitSuccess op de embed-container.
Ja. Gebruik de headless React-renderer als je eigen markup en styling nodig hebt.