Skip to main content

​
Inline Embed

The simplest way to embed a form using data attributes: 
<div data-orbit-form="your-form-slug" data-orbit-team="your-team-id"></div>
<script src="https://orbitforms.ai/embed.js"></script>
Or use the JavaScript API for more control: 
<div id="orbit-form"></div>
<script src="https://orbitforms.ai/embed.js"></script>
<script>
  OrbitForms.inline('your-form-slug', '#orbit-form', { team: 'your-team-id' });
</script>
Open the form in a modal overlay: 
<div 
  data-orbit-form="your-form-slug"
  data-orbit-team="your-team-id"
  data-orbit-embed="popup"
  data-orbit-button-text="Open Form"
  data-orbit-size="medium"
></div>
<script src="https://orbitforms.ai/embed.js"></script>

​
Data Attributes

AttributeDescription
data-orbit-formForm slug (required)
data-orbit-teamTeam ID (required)
data-orbit-embedEmbed type: standard, popup, slider, sidetab, popover
data-orbit-typeForm type: standard, flow
data-orbit-button-textButton text for interactive embeds
data-orbit-button-colorButton background color
data-orbit-sizePopup size: small, medium, large
data-orbit-positionSlider/sidetab position: left, right
data-orbit-heightExplicit height for inline embeds

​
Events

Listen for form events using CustomEvents: 
// Listen for form events
document.addEventListener('orbitFormLoaded', (e) => {
  console.log('Form loaded:', e.detail.slug);
});

document.addEventListener('orbitFormSubmitted', (e) => {
  console.log('Form submitted:', e.detail);
  // e.detail contains: { slug, formId, verified }
});

document.addEventListener('orbitFormError', (e) => {
  console.error('Form error:', e.detail.message);
});

document.addEventListener('orbitFormResize', (e) => {
  console.log('Form resized to:', e.detail.height);
});

document.addEventListener('orbitPopupClosed', (e) => {
  console.log('Popup closed:', e.detail);
  // e.detail contains: { slug, type } where type is popup/slider/sidetab/popover
});

​
Embed Types

Inline (standard)

Embed directly in page content

Popup

Centered modal overlay

Slider

Slides in from the side

Sidetab

Floating tab that expands to form

Popover

Anchored popover near trigger
Next: Best Practices →