Integrations5 min read
Embedding forms on your website
Use standard, fullpage, popup, slider, or popover embed modes to add forms to any webpage.
Embedding lets you display your Spiceform directly inside your own website, landing page, or web app. Spiceform supports five distinct embed modes, each designed for a different user experience.
Embed modes
- •Standard — a responsive iframe that fits inside any container. The form fills the available width and adjusts its height based on content.
- •Full Page — the form takes over the entire browser viewport. Best for dedicated survey pages.
- •Popup — the form appears in a centered modal overlay, triggered by a button click or timer.
- •Slider — the form slides in from the right side of the screen, triggered on click or automatically.
- •Popover — a small floating widget attached to a trigger button, ideal for quick feedback or NPS surveys.
Generating an embed snippet
- 1Open the form in the builder and navigate to the Share tab.
- 2Scroll to the "Embed" section and select your preferred mode.
- 3Configure mode-specific options (e.g., trigger button text for Popup, auto-open delay for Slider).
- 4Click "Copy Code". The generated HTML/JS snippet is copied to your clipboard.
- 5Paste the snippet into your website's HTML where you want the form to appear.
CMS compatibility
The embed snippets work with any website or CMS that allows custom HTML, including WordPress, Webflow, Squarespace, Shopify, Wix, and plain HTML pages.
Pro tip
For single-page apps (React, Next.js, Vue), use the iframe URL directly in an <iframe> tag or render it with a dynamic import for seamless integration.
Important
Some website builders restrict custom scripts. If the form doesn't appear, check your CMS's embed/custom code settings.
Was this article helpful?