Use the animation shortcode to show an After Effects animation.
Use the animation shortcode to show an After Effects animation, powered by Lottie . The Lottie library supports animations that have been exported as JSON with Bodymovin. The animation uses vector graphics and is responsive. The shortcode is a simplified wrapper of the Lottie library that provides basic functionality. As an example, the following shortcode shows an animation that plays when hovering the mouse over it.
The shortcode supports the following arguments:
|id||No||Optional unique id of the animation element, e.g. |
|class||No||Optional class attribute of the container element.|
|data||Yes||Required path of the JSON file that contains the animation, relative to the |
|loop||No||Flag to indicate the animation should play in a loop, defaults to |
|auto||No||Flag to indicate the animation should start playing automatically, defaults to |
|hover||No||Flag to indicate the animation should start playing when hovering the mouse over it, defaults to |
|title||No||Optional accessible animation title.|
Change the behavior of your animation with shortcode arguments.
Assign a valid path to
data to provide a JSON file that contains the animation as input. The file should be stored in the
static folder, or in one of its subfolders.
auto to false and
hover to true to trigger the animation when hovering the mouse over it.
Assign a specific identified to the animation by setting the
id argument. The following example assigns the id
gatin-animation to the animation.