EN

Lottie Only

A media section that renders a standalone Lottie JSON animation. The section wraps the lottie partial, which loads the Lottie player web component and plays the animation with configurable speed, autoplay, and loop settings.

Configuration

yaml
- sectionType: lottie-only
  containerTag: section
  # more settings

  lottie:
    src: '/assets/lotties/example4.json' # URL of the Lottie JSON file
    speed: 1 # playback speed multiplier
    control:
      autoplay: true # start playing when loaded
      loop: true # repeat the animation

Configuration Options

PropertyTypeRequiredDescription
lottie.srcstringYesURL of the Lottie JSON animation file
lottie.speednumberNoPlayback speed multiplier (default1)
lottie.control.autoplaybooleanNoStarts the animation automatically whentrue
lottie.control.loopbooleanNoRepeats the animation whentrue

Notes

  • The Lottie player library is loaded from CDN by the lottie partial when the section renders
  • The animation renders with a transparent background so section backgrounds show through
  • For a Lottie animation combined with text and CTAs, use the multi-media section withmediaType: lottie