• 0k
  • 0
Conseils \ 31 Janvier 2013

Tutoriel HTML5 : Créez Une Page d’Accueil Dynamique Avec Des Galeries Animées

En parcourant les sites créés avec Wix ces derniers temps, nous avons découvert Le Tigre Tent. La galerie animée sur la page d’accueil du site nous a immédiatement séduits. Les images qui défilent sur ce fond original teinté de gris donnent vie au site et attirent l’attention des visiteurs de façon quasi-hypnotique.

Intégrez une galerie d'images dynamique sur votre site

Le Tigre Tent

Peu d’utilisateurs de Wix savent utiliser cette fonctionnalité – qui est d’autant plus utile maintenant que notre éditeur d’images est en ligne – et nous avons pensé qu’un court tutoriel détaillant les étapes à suivre pourrait éventuellement en intéresser certains.

Nous avons choisi de modifier le modèle “Aperçu HTML”  pour l’exemple en question, mais vous pouvez reproduire la manœuvre sur n’importe lequel de nos modèles HTML5.

Intégrez une galerie d'images dynamique sur votre site

  • Sélectionnez l’espace que vous voulez consacrer à votre galerie sur la page d’accueil de votre site.
  • Ajoutez une boite qui servira de support à votre galerie : cliquez sur « Ajouter » puis « Formes & Lignes » et « Boîte ».
Comment créer des galeries d'images dynamiques
  • Étirez la boite sur l’espace que vous lui avez réservé.
  • Cliquez sur « Modifier Style » pour la personnaliser – Changez les couleurs, modifiez la bordure, activez les ombres etc.
Créez Une Page d’Accueil Dynamique Avec Des Galeries Animées
  • Mettez en place votre galerie : cliquez « Ajouter » , « Galerie » puis « Grid Animée ».
  • Étirez la galerie pour couvrir l’espace de la boîte.
Créez Une Page d’Accueil Dynamique Avec Des Galeries Animées
  • Pour la personnaliser cliquez sur « Paramètres ».
  • Modifiez le nombre de colonnes et de rangées selon vos besoins.
  • Élargissez les marges de 0 à 10 pour donner de l’espace à votre présentation.
  • Sélectionnez « Verticale » (sous « Transition »).
Créez Une Page d’Accueil Dynamique Avec Des Galeries Animées
  • Choisissez la durée de transition (5 secondes est le maximum).
  • Nous recommandons de ne pas afficher les boutons de navigation et de lecture automatique.
  • Sous la catégorie « En cliquant sur l’image » cliquez sur l’option qui vous convient (« Entrer en mode agrandissement » est un choix judicieux).
Créez Une Page d’Accueil Dynamique Avec Des Galeries Animées
  • Cliquez sur «Changer Style » pour personnaliser le design de votre galerie.
Créez Une Page d’Accueil Dynamique Avec Des Galeries Animées
  • Retournez sur galerie et cliquez sur « organiser les images ».
Créez Une Page d’Accueil Dynamique Avec Des Galeries Animées
  • Téléchargez vos images.
Créez Une Page d’Accueil Dynamique Avec Des Galeries Animées
  • Vous pouvez ajouter des titres et descriptions à vos photos et utiliser les flèches à la gauche des images afin de modifier l’ordre de leur présentation.
  • Le nombre de photos que vous décidez de présenter dépend du nombre de rangées et colonnes de votre galerie. Pour une galerie 3/3, 27 images seront suffisantes pour exposer l’étendue de vos talents.
  • Une fois votre galerie terminée, cliquez sur « Enregistrer » puis « Aperçu » afin de vérifier si elle correspond à vos attentes. Si ce n’est pas le cas, modifiez-la à souhait jusqu’à ce que son apparence soit satisfaisante à vos yeux.

Et voilà le résultat :

Intégrez une galerie d'images dynamique sur votre site

Découvrez notre nouvel éditeur d’images.


Recevez le
par e-mail !

Rejoignez le blog de Wix Ne manquez rien de notre actu !

Adresse courriel invalide.

l\'email existe déjà

Adresse courriel invalide.

Rejoignez-nous ! \ 

Découvrez nos conseils en web design, en marketing digital,
et suivez toute l'actu Wix ! Pas de spam. Promis.

Adresse courriel invalide.

l'email existe déjà

Adresse courriel invalide.