Embed Lottie Player Pro extends the Lottie Player Gutenberg block for animations in WordPress posts, pages, widgets, and shortcode-compatible areas. Add a .json or .lottie animation by entering its file URL; Pro also supports direct uploads. Set the player width and align it left, center, or right. Common placements include landing pages, product explanations, portfolios, blogs, and documentation.

Playback and links

The standard player supports autoplay, looping, visible or hidden controls, and an attached link. Pro includes hover playback, playback modes, forward or backward direction, play count, speed, and an interval between loops. When a link is attached, Pro can open it in a new tab.

Scroll, cursor, and visibility triggers

Pro can synchronize playback with scrolling, including movement relative to the player container or with a scroll offset. Cursor options follow cursor position or horizontal movement. You can also start playback on click or when the player becomes visible.

Player controls and captions

Control styling includes height, background color, icon colors for normal, hover, and active states, tracker color, and thumb color. Pro includes a caption below the player, with options for text alignment, typography, text and background colors, padding, and margin.

Add and configure the block

1. Install and activate the Lottie Player block add-on.
2. In the Gutenberg editor, add the Lottie Player block from the Widgets category.
3. Enter a supported .json or .lottie file URL, or upload either format directly with Pro.
4. Set playback, interaction, layout, control, and caption options in the right-side options sidebar.
5. Publish the post or page when the player is ready.

The extension also supports placing the animation in shortcode-compatible areas.