É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 "Flottant" et "Expansion" pour créer des pages imaginatives et saisissantes et attirer l'attention des visiteurs sur votre contenu.
Vous pouvez appliquer des animations à une variété d'éléments, et même appliquer différents effets au même élément sur vos sites de bureau et mobiles. L'animation sur votre site mobile est paramétrée pour s'adapter aux petits écrans, afin que vous puissiez continuer à impressionner vos visiteurs. En savoir plus sur les effets d'animation sur votre site mobile
Dans cet article, apprenez comment :

Ajouter une animation à un élément

Commencez à rendre votre site dynamique et attrayant en ajoutant une animation à vos éléments. Chaque animation a son propre effet, vous pouvez donc les mélanger avec différents éléments et donner à vos visiteurs une impression durable.

Pour ajouter une animation :

  1. Cliquez sur l'élément concerné dans l'Éditeur.
  2. Cliquez sur l'icône Animation  .
  3. Sélectionnez une animation parmi les options disponibles.
Remarque :
Supprimez les effets d'animation de vos éléments en cliquant sur l'icône Animation  sur l'élément, puis en cliquant sur Aucun .
Suggestion :
Vous pouvez ajouter une animation à un groupe d'éléments en sélectionnant le groupe et en cliquant sur l'icône Animation .

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.

Pour personnaliser l'animation :

  1. Cliquez sur l'élément concerné dans votre Éditeur.
  2. Cliquez sur l'icône Animation  .
  3. Cliquez sur Personnaliser et utilisez les options pour ajuster votre animation :
    • Puissance : Cliquez sur le menu déroulant et sélectionnez la puissance de l'animation lors de la lecture.
    • Direction : Sélectionnez la direction à partir de laquelle l'animation entre, par exemple dans le sens des aiguilles d'une montre ou à partir de la droite.
    • Distance : Utilisez le curseur pour augmenter ou diminuer la distance entre le point de début et 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.
    • Animer uniquement la première fois : Cliquez sur le curseur pour activer / désactiver l'animation qui ne s'affiche que lors du premier chargement de la page.
Remarque :
Les options de personnalisation disponibles dépendent de l'animation que vous choisissez.

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 :
Si vous souhaitez qu'un élément soit animé à la fois sur les versions ordinateur et mobile de votre site, vous devez ajouter l'effet dans les deux Éditeurs. Les effets d'animation que vous avez ajoutés sur ordinateur ne sont pas reportés sur votre site mobile, car ils sont optimisés pour différentes tailles d'écran.

Pour ajouter une animation sur mobile :

  1. Accédez à votre Éditeur mobile.
  2. Cliquez sur l'élément concerné.
  3. Cliquez sur l'icône Animation .
  4. Sélectionnez une animation parmi les options disponibles.
Important :
  • Les animations ajoutées aux éléments dans l'en-tête s'affichent uniquement lorsque l'élément est chargé pour la première fois.
  • Si un élément est masqué/affiché à l'aide de Velo, ses animations doivent également être paramétrées via Velo. En savoir plus sur les éléments Velo
Des problèmes avec votre animation ?
Suivez nos étapes pour vous assurer qu'elles fonctionnent comme prévu sur votre site en ligne.

Cela vous a-t-il aidé ?

|