Le widget Lottie Animation vous permet d'ajouter des animations vectorielles de qualité sur votre site.
Lottie est une bibliothèque mobile pour Android et iOS qui analyse les animations Adobe After Effects exportées au format JSON avec Bodymovin, et qui assure leur rendu sur les appareils mobiles et sur le web.
Recherchez une animation exportée avec le plugin Bodymovin dans LottieFiles, ou créez votre propre animation dans After Effects.
Pour ajouter le :
- Dans le panneau de gauche, cliquez sur Widgets.
- Cliquez sur le Lottie Animation et déposez-le sur votre site.
Pour en savoir plus sur l'ajout de sur votre site, consultez l'article Ajout de widgets.
Éditeur de contenu
Pour accéder à l'éditeur de contenu :
- Effectuez un clic droit sur le , puis sélectionnez Modifier le contenu.
- Copiez l'URL Lottie Animation dans la zone prévue à cet effet.
- Pour trouver l'URL de l'animation, ouvrez l'animation dans LottieFiles et cliquez sur <html>. Vous pouvez également coller l'URL d'un fichier JSON hébergé sur un autre site que LottieFiles.
- Sélectionnez Loop Animation (Animation en boucle) pour lire l'animation en continu ou sélectionnez Animate on click (Animer au clic).
- (Facultatif) Pour ajouter un lien vers l'animation, cliquez sur Link (Lien) et sélectionnez le type de lien.
- Si vous utilisez une animation LottieFile gratuite, vous devez inclure les références de son créateur. Ces informations se trouvent en bas de la fenêtre contextuelle de l'animation. Pour en savoir plus, consultez les informations sur les licences Creative Commons de LottieFile.
Éditeur de design
Pour accéder à l'éditeur de design, faites un clic droit sur le et cliquez sur Modifier le design.
Pour redimensionner le widget, déplacez les curseurs de largeur et de hauteur. Pour conserver les proportions entre la largeur et la hauteur, sélectionnez Conserver les proportions.
Pour obtenir des informations sur les options de conception qui ne sont pas spécifiques à ce (la disposition, le style et l'espacement, par exemple), voir Conception des widgets.