Native Divi 5 ModulePro

Divi Lottie Animation

Lightweight, interactive Lottie animations.

Why use the Divi Lottie Animation module?

Lottie animations are small, sharp at any size, and load faster than an equivalent video or GIF, but embedding one in stock Divi means a code module and a manually written player script.

Lottie Animation is one module: point it at a file or a public URL, pick how it triggers, and the module handles the player. No script to write by hand.

This is the live module, playing when it scrolls into view.

What you get out of it

Upload a file, or link a URLSource can be a file from the media library or any public Lottie JSON URL.Four trigger modesAutoplay, on scroll into view, on click, or on hover.Loop and playback speedIndependent settings, so a short loop can play back slower or faster than 1x.SVG or canvas renderingA choice between two rendering engines, depending on the animation and the browsers you support.An optional captionCustom caption text with its own font group, or none at all.Native on Divi 5Ships in Divi Torque Pro. A Divi 4 layout using the same module converts across.

Everything the Divi Lottie Animation module does

Every option below ships in Divi Torque Pro.

Source: uploaded file, or an external URLTrigger: none (autoplay), viewport, click or hoverLoop on or offPlayback speedRenderer: SVG or canvasAlignment: left, centre or rightWidth, max width and opacityOptional caption, with its own font group

See the Divi Lottie Animation in action

This is the live module playing a real Lottie file, not a GIF or a video. Scroll it into view to trigger it.

Plays on scroll

Trigger set to Viewport, loop on.

Click to play

Trigger set to On Click instead of autoplay or viewport.

Click to play

Nothing happens until you click it.

Adding one takes about a minute

Three steps, and none of them involve custom CSS.

1Drop in the moduleAdd Lottie Animation to any row. It arrives with an empty source.2Add the file or the URLUpload a .json/.lottie file, or paste a public Lottie URL.3Pick the triggerAutoplay, on scroll, on click, or on hover, set in the Content panel.

Questions people ask first

Short answers, all of them checked against what the module actually does.

Is the Lottie Animation module free?No. It ships in Divi Torque Pro. The free plugin does not include it.Does it need Divi 5?It is a native Divi 5 module. A Divi 4 layout using the same module converts across, since it shares the same shortcode.Can I recolour the animation from inside the module?No. A Lottie file's colours and shapes are fixed at export time. The module plays the file as-is.Does it come with a built-in animation library?No. Every instance needs its own source, either uploaded or linked from a public URL.Can it play automatically without a trigger?Yes. Trigger set to none autoplays as soon as the module renders.Which renderer should I pick?SVG suits most animations and scales cleanly. Canvas can perform better for very complex animations with many shapes; try both if playback feels slow.