Section - Face Age

A section occupies a full row on any page — your home page, a landing page, or a skin-analysis page of its own. It’s the default display model.

Add a section

Add a container where the section should appear, then render with displayModel: 'section':

<!-- where the section appears -->
<div id="face-age"></div>

import FaceAge from 'face-age';

const faceAge = new FaceAge({
  elementId: 'face-age',
  faceageId: '<Your Client ID>',
  displayModel: 'section',
  height: '800px', // optional
});

faceAge.render();

Options

Option	Default	Description
`elementId`	—	Required. ID of the container element.
`height`	`'800px'`	Height of the section.

All other options — quiz, products, routines, history — work the same in every mode. See Configuration.

When to use it

A dedicated “Find your routine” or “Skin analysis” page.
A block on your home page that invites shoppers to scan.
A quiz page where the scan is the main content.