Qqwery Form Embed v1.0.0

Powerful, secure form embedding for your website

Quick Start

<!-- 1. Include the script -->
<script src="https://cdn.qqwery.com/js/embed.min.js"></script>

<!-- 2. Add inline embed -->
<div data-qqwery-embed data-form="YOUR_FORM_ID"></div>

<!-- OR popup trigger -->
<button data-qqwery-popup data-form="YOUR_FORM_ID">
  Open Form
</button>

Inline Embed

Embed forms directly in your page content.

<div 
  data-qqwery-embed 
  data-form="abc123"
  data-height="700px"
  data-max-width="900px"
  data-include-params
></div>

Options

data-form - Form ID (required)
data-width - Width (default: 100%)
data-height - Height (default: 700px)
data-max-width - Maximum width (default: 900px)
data-include-params - Include URL params (utm_*, ref, source)

Popup Modal

Trigger forms in a modal overlay.

<button 
  data-qqwery-popup 
  data-form="abc123"
  data-position="center"
>
  Open Form
</button>

Positions

center - Centered modal (default)
bottom - Slide up from bottom
left - Slide in from left
right - Slide in from right

JavaScript API

// Open popup programmatically
QqweryEmbed.openPopup('form_id', {
  position: 'center',
  width: '800px',
  height: '600px'
});

// Re-initialize embeds (for SPAs)
QqweryEmbed.init();

// Enable debug mode
QqweryEmbed.enableDebug();

// Listen for form submissions
document.addEventListener('qqweryFormSubmit', (e) => {
  console.log('Form submitted:', e.detail);
});

Events

// Form submission
document.addEventListener('qqweryFormSubmit', (event) => {
  const { formId, data } = event.detail;
  console.log('Form submitted:', formId, data);
});

// Analytics tracking
document.addEventListener('qqweryAnalytics', (event) => {
  const { event: eventName, formId } = event.detail;
  // Send to your analytics
});

Available Files

/js/embed.js - Development version (non-minified)
/js/embed.min.js - Production version (minified) ⭐
/js/embed-v1.0.0.js - Versioned development
/js/embed-v1.0.0.min.js - Versioned production

⚠️ Production Recommendation: Always use embed.min.js for better performance (50% smaller file size).

Security Features

✅ Iframe sandboxing
✅ Origin validation
✅ XSS protection
✅ Input sanitization
✅ HTTPS-only in production

Browser Support

Chrome, Edge, Firefox, Safari (last 2 versions)
Mobile browsers (iOS Safari, Chrome Android)
IE11 not supported

Qqwery Form Embed v1.0.0

Documentation