Éditeur Wix : Ajouter et personnaliser une animation
Temps de lecture : 4 min
Utilisez des animations pour donner vie à votre site. Ajoutez des effets tels que "Float-in" et "Expand-in" pour créer des pages inventives et saisissantes. Vous pouvez choisir comment et quand vos animations sont lues - une seule fois, au défilement, en boucle, et plus encore.
Vous pouvez appliquer des animations à une variété d'éléments, et même appliquer différents effets au même élément sur votre ordinateur et votre site mobile. Nos animations mobiles sont conçues pour s'adapter aux petits écrans, afin que vous puissiez épater vos visiteurs sur n'importe quel appareil.
Dans cet article, apprenez comment :
Des problèmes avec votre animation ?
Suivez nos étapes pour vous assurer qu'ils fonctionnent comme prévu sur votre site en ligne.
Ajouter une animation à un élément
Rendez votre site dynamique et attrayant en ajoutant une animation à vos éléments. Chaque animation a son propre effet différent, vous pouvez donc les mélanger avec différents éléments et donner à vos visiteurs une impression durable.
Suggestion :
Vous pouvez ajouter une animation à un groupe d'éléments en sélectionnant le groupe et en cliquant sur l'icône Animation 
.
.Pour ajouter une animation :
- Cliquez sur l'élément concerné dans votre Éditeur.
- Cliquez sur l'icône Animation .
- Sélectionnez une animation parmi les options disponibles.
- Entrée: L'animation n'est lue qu'une seule fois lorsque l'élément sélectionné apparaît à l'écran.
- En boucle: L'animation est lue en boucle continue.
- Défilement: L'animation est lue lorsque l'élément défile dans la vue.
Remarque :
Les éléments de votre en-tête ne seront animés qu'une seule fois, lors de la première visite sur la page.
Personnaliser une animation
Après avoir ajouté une animation à un élément, vous pouvez le personnaliser pour qu'il se comporte comme vous le souhaitez et qu'il corresponde à l’atmosphère de votre site.
Ajustez les paramètres tels que la puissance, la direction et le délai pour avoir un impact et engager vos visiteurs.
Remarque :
Les options de personnalisation disponibles dépendent de l'animation que vous choisissez.
Pour personnaliser l'animation :
- Cliquez sur l'élément concerné dans votre Éditeur.
- Cliquez sur l'icône Animation .
- Cliquez sur Personnaliser et utilisez les options pour ajuster votre animation :
- Puissance : Cliquez sur le menu déroulant pour sélectionner la puissance de l'animation lorsqu'elle est lue.
- Direction : Sélectionnez la direction à partir de laquelle l'animation entre (par exemple dans le sens des aiguilles d'une montre, à partir de la droite).
- Distance : Utilisez le curseur pour modifier la distance entre le point de départ et le point de fin de l'effet.
- Durée : Utilisez le curseur pour ajuster la durée de lecture de l'animation.
- Délai : Faites glisser le curseur pour augmenter ou diminuer le délai entre le chargement de la page et le début de l'animation.
- Type d'animation : Choisissez parmi le type d'animation interne, externe ou continu lors du défilement.
- Style de mouvement : Sélectionnez l'intensité du mouvement, par exemple léger ou modéré.
Ajouter des animations à votre site mobile
En plus d'ajouter des animations aux éléments de votre site sur ordinateur, vous pouvez également les ajouter à votre site mobile, afin que vos visiteurs bénéficient d'une excellente expérience de navigation depuis tous leurs appareils.
Les animations pour mobile ont été spécialement conçues pour les petites résolutions et tailles d'écran, vous n'avez donc pas à vous soucier de l'espacement.
Remarque :
Les effets d'animation que vous ajoutez sur ordinateur ne sont pas reportés sur votre site mobile, car ils sont optimisés pour différentes tailles d'écran. Si vous souhaitez qu'un élément soit également animé sur mobile, suivez les étapes ci-dessous.
Pour ajouter une animation sur mobile :
- Accédez à votre Éditeur mobile.
- Cliquez sur l'élément concerné.
- Cliquez sur l'icône Animation .
- Sélectionnez une animation parmi les options disponibles.
Remarque importante pour Velo :
Si vous utilisez Velo (code) pour masquer ou afficher un élément, son animation doit également être définie via Velo.
Cela vous a-t-il aidé ?
|