Guide · 6 min read
How to embed a form on your website
There are several ways to put a form on your site, from a one-line snippet to a fully custom API integration. This guide walks through inline embeds, popup modals, the web component and JS SDK, and the public REST API so you can pick the approach that fits your build.
Inline embed
An inline embed drops the form directly into the flow of your page, so it sits between your other content like any other section. You paste a small snippet where you want the form to appear, and it renders in place, no redirect, no separate landing page.
The simplest version is a web component: add the <yeetform-embed> tag with your form slug and the form loads inline. If you prefer, the same effect is available through a single JS SDK call that renders into a target element you choose.
Popup or modal
Sometimes you do not want the form on the page at all until someone asks for it. A popup or modal keeps your layout clean and opens the form in an overlay when a visitor clicks a button, ideal for contact buttons, feedback widgets, or a call-to-action in the corner of the screen.
With the JS SDK you wire a button to YeetForm.open(slug) and the form appears in a centered modal over your page. The visitor fills it in without ever leaving, and the overlay closes on submit, so the form never competes with your main content for space.
Web component and JS SDK
For most sites the web component and the JS SDK cover everything. The <yeetform-embed> tag is the no-build option, it works in plain HTML, in a CMS block, or inside any framework that allows custom elements. The JS SDK gives you programmatic control when you need it.
The SDK (public/sdk.js) exposes a small set of methods:
- YeetForm.render(slug, target, options), embed the form inline into an element you choose.
- YeetForm.open(slug, options), open the form in a modal popup.
- YeetForm.load(slug, lang), headlessly fetch the form schema, for example to count or inspect fields.
- YeetForm.submit(slug, answers), submit a response programmatically from your own code.
API for custom integrations
When you need full control, a bespoke front end, a mobile app, or a server-side flow, use the public REST API. It is CORS-enabled, so you can call it directly from browser code, and unauthenticated for public forms, so no API key is needed to load a schema or post a response.
A typical integration fetches the form schema with a GET request, renders the fields however you like in your own UI, then POSTs the collected answers back as a response. Because the schema is just JSON, you can drive completely custom layouts while YeetForm still handles storage, notifications, and analysis behind the scenes.