Display modes overview

The SDK renders in one of three display models. Pick one with the displayModel option — you can change it at any time.

Section

Occupies a full row on any page — home, a landing page or a quiz page of its own.

A floating button on every page opens the analysis full-screen — shoppers never leave what they’re browsing.

Shows only the analysis panel, so your own page can react to the result.

Mode	`displayModel`	Container	Size
Section	`'section'` (default)	`elementId` required	Fills one content row; `height` defaults to `800px`
Modal	`'modal'`	Not needed	Full-screen overlay
Widget	`'widget'`	`elementId` required	Fixed-size panel; `width` defaults to `360px`, `height` to `580px`

Every mode runs the same analysis and supports the same options, API and events. Only where and how it appears changes.

Try all three on the live demo — it’s the real SDK running on a sample store.