Settings¶
Configuration → Content authoring → Canvas Builder → Styles → Animation
- Effects — the vocabulary offered in the panel. Each carries a label and
the bundle of values it applies, plus two optional keys:
requires— a detector the target must satisfy for the effect to be offered.svgneeds artwork with strokes;multipleneeds the target to resolve to more than one element.family— the engine feature the effect belongs to (draw,declared, …). The active engine builds every family in, so a preset never names a library.
- Easings and Repeat options — the choices the panel lists.
- Ranges — the slider bounds (max distance, max delay + duration, stagger and repeat-delay ceilings and steps).
- Defaults — the value every unset key falls back to, site-wide.
- Smooth scrolling — eases the whole page behind the scroll wheel (via Lenis). Off by default. See below.
A component's effective default is the site default overlaid with the effect it chose, so what the panel shows is what will actually play.
Smooth scrolling¶
Lenis smooths the page's real native scroll directly rather than transforming
a wrapper/content pair, so there is no risk of a position: fixed descendant
(an admin toolbar, a sticky header) ending up positioned against the wrong
ancestor. No template change is needed anywhere.
Smoothing never applies on an admin route, in the editor, inside a preview iframe, or for a visitor who asked for reduced motion. The iframe test is "am I the top window" rather than a path check, because Page Preview renders the published path inside an iframe.
Lenis itself loads from the jsDelivr CDN — a script-src policy that omits
cdn.jsdelivr.net disables smooth scrolling specifically (the page just
scrolls normally; every other Motion feature is unaffected, since the
animation engine itself loads nothing from a CDN).