Éditeur Studio : Ajouter et personnaliser des fichiers d'animation Lottie
4 min
LottieFiles est une excellente source d'animations de haute qualité à ajouter au site de votre client. Après avoir importé l'animation via son URL, vous pouvez la redimensionner selon vos besoins et décider si elle est lue ou non en boucle.
Avant de commencer :
Pour importer une animation, vous devez avoir un compte LottieFiles.
Importer des animations à partir de LottieFiles
Ajoutez autant d'animations Lottie que vous le souhaitez pour animer votre design. Après avoir enregistré une animation dans votre espace de travail dans LottieFiles, vous pouvez copier l'URL JSON et la coller directement dans l'Éditeur Studio. L'animation est instantanément ajoutée comme nouvel élément de page.
Vous pouvez également ajouter un nouvel élément d'animation Lottie et coller l'URL correspondante dans le panneau Paramètres.
Important :
Wix ne prend en charge que les URL Lottie au format JSON.
Pour ajouter un élément Animations Lottie :
- Cliquez sur Ajouter des éléments sur le côté gauche de l'Éditeur.
- Cliquez sur Média.
- Cliquez sur Lottie.
- Cliquez sur l'icône Ajouter au site à côté de Animations Lottie.
- (Dans un onglet de navigateur distinct) Copie l'URL JSON de l'animation enregistrée depuis votre compte LottieFiles.
- Collez l'URL de l'animation dans l'Éditeur :
- Cliquez sur l'élément Lottie dans l'Éditeur.
- Cliquez sur l'icône Paramètres .
- Collez l'URL sous Quelle est l'URL de l'animation ?.
- Appuyez sur la touche Entrée de votre clavier.
sur le côté gauche de l'Éditeur.
à côté de Animations Lottie.
Prochaine étape ?
Cliquez sur Aperçu de l'animation en haut du panneau Paramètres pour voir à quoi elle ressemble avant de la mettre en ligne.
Travailler avec des points de rupture :
Vous pouvez personnaliser la taille de l'animation Lottie par point de rupture, afin qu'elle soit idéale sur tous les écrans.
Modifier l'animation Lottie
Si vous souhaitez passer à une animation Lottie différente, vous pouvez facilement le faire en collant la nouvelle URL dans le panneau Paramètres de l'élément.
Pour modifier l'animation :
- Sélectionnez l'élément Animation Lottie.
- Cliquez sur l'icône Paramètres .
- Collez l'URL de la nouvelle animation sous Quelle est l'URL de l'animation ?.
Paramétrer l'animation pour qu'elle soit jouée en boucle
Vous pouvez choisir la façon dont l'animation Lottie est lue sur le site de votre client - une seule fois ou en boucle continue.
Pour définir la lecture de l'animation :
- Sélectionnez l'élément Animation Lottie.
- Cliquez sur l'icône Paramètres .
- Cliquez sur le curseur Lecture en boucle pour l'activer ou le désactiver.
Ajouter un texte alternatif à une animation Lottie
À partir du panneau Paramètres, ajoutez un texte alternatif pour décrire brièvement l'animation et/ou le site. Cela peut améliorer le classement en référencement tout en aidant les utilisateurs avec des lecteurs d'écran pour comprendre ce que l'animation affiche.
Pour ajouter un texte alternatif à votre animation :
- Sélectionnez l'élément Animation Lottie.
- Cliquez sur l'icône Paramètres .
- Faites défiler jusqu'à Texte de l'animation.
- Saisissez la description du texte sous Rédiger un texte alternatif pour votre animation.
- Appuyez sur la touche Entrée de votre clavier.
Informations importantes :
Seuls les fichiers Lottie au format JSON sont pris en charge sur les sites Wix. Pour des raisons techniques, tous les champs de fichier dans les fichiers JSON ne peuvent pas être contenus. Les animations Lottie peuvent donc être légèrement différentes sur un site Wix en ligne (par exemple l'affichage d'une plage / d'une quantité de mouvement réduites).