Skip to main content
Add your Orbit AI forms directly to your website using our embed codes.

​
Getting Your Embed Code

1

Open your form

Open your form in the dashboard
2

Go to Share

Go to the Share tab
3

Copy embed code

Select your embed type and copy the code

​
Embed Types

​
Standard Embed (iframe)

The simplest way to embed your form. Just paste the iframe code where you want the form to appear. 
<iframe
  src="https://orbitforms.ai/r/{team-id}/your-form?embed=true"
  width="100%"
  height="500"
  frameborder="0"
></iframe>

Best for

  • Simple integrations
  • Static websites
  • Quick setup

Considerations

  • Fixed height required
  • Limited responsiveness
  • No auto-resize

​
JavaScript Embed

Recommended — The JavaScript embed automatically resizes to fit your form content and provides the best user experience.
<div data-orbit-form="your-form" data-orbit-team="your-team-id"></div>
<script src="https://orbitforms.ai/embed.js"></script>

Features

  • Auto-resizing
  • Popup support
  • Event callbacks
  • Pre-fill support

Data Attributes

  • data-orbit-form: form slug
  • data-orbit-team: team ID
  • data-orbit-embed: popup | slider
  • data-orbit-height: custom height
Open your form in a modal overlay, triggered by a button click. 
<div
  data-orbit-form="your-form"
  data-orbit-team="your-team-id"
  data-orbit-embed="popup"
  data-orbit-button-text="Open Form"
></div>
<script src="https://orbitforms.ai/embed.js"></script>

​
Trigger from your own buttons

If you want to use your own buttons (e.g. in Webflow, WordPress, or any custom site), use the JavaScript API with a CSS class: 
<script src="https://orbitforms.ai/embed.js"></script>
<script>
  document.addEventListener('DOMContentLoaded', function() {
    var popup = OrbitForms.popup('your-form', {
      team: 'your-team-id',
      size: 'medium'
    });

    document.querySelectorAll('.orbit-popup-trigger').forEach(function(btn) {
      btn.addEventListener('click', function(e) {
        e.preventDefault();
        popup.open();
      });
    });
  });
</script>
Add the class orbit-popup-trigger to every button that should open the popup. You can have unlimited buttons across the page — they’ll all open the same form. The team value is the first 8 characters of your team UUID, visible in the Share tab.
For detailed setup instructions for Webflow, WordPress, Squarespace, and more — see the Embed Script documentation.

​
Pre-filling Fields

You can pre-fill form fields using URL parameters: 
orbitforms.ai/r/{team-id}/[email protected]&name=John

​
Form Events

Listen to form events using CustomEvents to trigger custom actions: 
// Form submitted
document.addEventListener('orbitFormSubmitted', function(e) {
  console.log('Form submitted:', e.detail.slug);
  // Track conversion, show message, etc.
});

// Form loaded
document.addEventListener('orbitFormLoaded', function(e) {
  console.log('Form loaded:', e.detail.slug);
});

// Form resized (for layout adjustments)
document.addEventListener('orbitFormResize', function(e) {
  console.log('New height:', e.detail.height);
});

​
Responsive Behavior

Forms automatically adapt to fit their container. Here’s what to know about field layouts:

​
Half-Width Fields

Fields set to “1/2” width will display side-by-side when the embed container is 510px or wider. Below this width, all fields stack vertically for better mobile usability.
  • ≥ 510px: Half-width fields appear side-by-side
  • < 510px: All fields stack vertically

​
Platform-Specific Guides

  • WordPress
  • Webflow
  • Squarespace
  • Shopify
  • React / Next.js

​
Next Steps

Embed Script Reference

Full API reference, popup setup, and platform guides

Submissions

View and manage responses