Introducing the Lottie Player Widget

We're excited to announce the SiteOrigin Lottie Player Widget. Capture user attention and bring your pages to life with Lottie animations. Activate the Lottie Player widget at PluginsSiteOrigin Widgets.

A Lottie is a JSON-based animation file format that enables designers to ship animations on any platform as easily as shipping static assets. They are small files that work on any device and can scale up or down without pixelation.
Source: https://lottiefiles.com/what-is-lottie

SiteOrigin Lottie Player Widget interface.

The Lottie Player Widget is ready to be used anywhere:

Page Builder: Insert widgets in Page Builder by SiteOrigin in either the Classic Editor or Page Builder Layout Block in the Block Editor.
Block Editor: 100% Block Editor compatible. Insert widgets using the SiteOrigin Widgets Block featuring a live widget search form.
Theme and Plugin Widget Areas: Insert widgets into any theme or plugin widget area.

Settings

Lottie File
Upload or select your Lottie JSON file.

Autoplay
Enable to autoplay the the animation.

Controls
Enable to display the player's controls.

Loop
Enable to loop the animation.

Destination URL
Enter a destination URL to link your animation.

Open in a new window
Enable to open the destination URL in a new window.

Lottie Animation Demo

SiteOrigin Premium Lottie Player Addon

SiteOrigin Premium users can immediately take advantage of the Lottie Player Addon. Head over to SiteOriginPremium Addons to activate the Lottie Player Addon. Customize and enhance your Lottie Player with the following additional settings.

Count
Number of times to loop the animation.

Direction
The direction of the animation. The Direction setting is available when Animation Mode is set to Normal.

Speed
The animation speed. 1 is 100% - 0 is 0%.

Animation Mode
The animation mode to use. Choose from Normal, Bounce, Scroll, Cursor Position, Click, Hover, Toggle, Hold, and Toggle Hold.

Lottie Player Addon additional settings.

Useful Links

Thanks for reading. If you have any comments or questions, please, let us know in the comments section below.

Leave a Reply

Your email address will not be published. Required fields are marked *