🧪 HEA Integration Guide — Test Pages

This guide covers the three primary patterns from the Integration Patterns page: Magic ask bar, Conversation starter (block), and the Floating pop-up.

1) Magic ask bar (askbar widget)

Auto-expandable “search-bar style” entry point powered by hea_askbar_embed.js. Quick to theme via data-* attrs; optionally opens full page on mobile.

Open Ask Bar Test

Tip: set data-fullpage-onmobile="1" to redirect to hea_simple in full page on phones.

2) Floating pop-up (script loader)

Loads hea_embed.js which injects the floating launcher and pop-up chat. Best for “always-available” assistants without taking page real estate.

Open Pop-up Test

3) Conversation starter (block)

A framed block using hea_simple.html in an <iframe>. Zero-JS, easy to drop into CMS pages, and ideal for hero/landing sections.

Open Conversation Starter Test

Comparison Matrix

Method	Isolation	Host JS Needed	Theming	Events	CSP
Magic ask bar (askbar widget)	High (iframe)	1 script	`data-*` / URL	`postMessage`	`script-src` + `frame-src`
Floating pop-up (script loader)	High (iframe)	1 script	`data-*` / URL	`postMessage`	`script-src` + `frame-src`
Conversation starter (block)	High (iframe)	No	URL params	`postMessage`	`frame-src`

Recommendation

👉 For most clients, start with the Conversation starter (block) or the Magic ask bar. Add the Floating pop-up for universal access.