HomeYou Widget Demo

Simple Integration

To add the HomeYou widget to any webpage, simply include this script tag:

That's it! The widget will automatically appear in the bottom-right corner of your page. When clicked, it opens the quote form in a modal overlay.

Advanced Usage

Manual Initialization

<script src="https://your-domain.com/widget.js" data-auto-init="false"></script>
<script>
    // Initialize manually
    const widget = new window.HomeYouWidgetClass();
</script>
            

Customization Methods

// Change position
HomeYouWidget.setPosition('top-left'); // top-left, top-right, bottom-left, bottom-right

// Change button text
HomeYouWidget.setButtonText('Custom Text');

// Hide/Show widget
HomeYouWidget.hide();
HomeYouWidget.show();

// Open/Close modal programmatically
HomeYouWidget.open();
HomeYouWidget.close();

// Remove widget completely
HomeYouWidget.destroy();
            

Event Listening

// Listen for widget events
window.addEventListener('homeyou-widget-event', function(event) {
    console.log('Widget event:', event.detail.event);
    // event.detail.event can be 'widget_opened' or 'modal_closed'
});
            

Widget Controls (Demo)

Position Controls:

Widget Controls:

Modal Controls:

Features

✅ Zero dependencies - pure JavaScript
✅ Responsive design - works on mobile and desktop
✅ Easy integration - just one script tag
✅ Modal iframe display - no popup blockers
✅ Customizable positioning and styling
✅ Event tracking support (Google Analytics compatible)
✅ No conflicts with existing page styles
✅ Smooth animations and professional UI
✅ Escape key and click-outside to close
✅ Body scroll prevention when modal is open
✅ Prevents multiple widget instances

Modal Experience

The widget now displays the quote form in a beautiful modal overlay instead of opening a new window. This provides several benefits:

No Popup Blockers: Works even when popup blockers are enabled
Better UX: Users stay on your page
Mobile Friendly: Responsive modal design
Professional Look: Smooth animations and modern styling
Easy to Close: Multiple ways to close (X button, Escape key, click outside)

Content Example

This is sample content to demonstrate how the widget appears alongside your existing page content. The widget is positioned as a floating element that doesn't interfere with your page layout.

When the modal opens, it creates a professional overlay that prevents interaction with the background content until closed. This ensures users focus on the quote form.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

🏠 HomeYou Widget Demo