Élément - Diaporama

Dernière mise à jour le 2023-03-02

L’élément Diaporama vous permet de mettre de l’avant un carrousel d’images avec ou sans texte et appel à l’action. Découvrez les nombreuses possibilités d’affichage de notre élément Diaporama pour capter l’attention de vos utilisateurs et pour mettre de l’avant plusieurs thématiques sur votre site Web.

Créer un élément Diaporama

Une fois que votre section est prête, ajouter un élément Diaporama:

  1. Choisissez d’abord si vous désirez utiliser un diaporama existant ou si vous désirez créer un nouveau diaporama.
  2. Donnez un titre (FR/EN) à votre diaporama et choisissez si vous voulez l’afficher ou non.
    1. Si vous affichez votre titre, assurez-vous de bien configurer votre titre: balise SEO, alignement et couleur. Ces informations sont accessibles en cliquant sur les 3 petits points à côté du champ TITRE.
  3. Cliquez sur Ajouter une diapositive afin d’ajouter votre première image du carrousel.
  4. Cliquez sur la slide créée (la première portera le nom “Diapositive 1”) pour la modifier.
  5. Sélectionnez une image tout en vous assurant que le format de celle-ci soit assez grand pour la section que vous éditez.

    À titre d’exemple, une image pleine largeur devrait être de minimalement 2560px de large.

  6. Ajoutez un titre et sélectionnez la couleur de celui-ci.
  7. Ajoutez du contenu dans la section “Slogan”, si nécessaire, et sélectionnez la couleur de celui-ci.
  8. Plusieurs paramètres de personnalisation sont aussi à votre disposition :
    1. Ordre d’affichage : Vous permet de déterminer dans quel ordre vous désirez voir les diapositives s’afficher sur le site.
    2. Style : Vous permet de déterminer l’alignement de votre titre.
    3. Boutons : Vous permet d’ajouter des appels à l’action sur vos diapositives.
  9. Remplissez vos informations dans toutes les langues de votre site Web et faites Retour pour aller ajouter des diapositives supplémentaires.
  10. Ajoutez toutes les diapositives nécessaires.
  11. Ajustez les paramètres de l’élément pour correspondre à vos besoins :
    1. Afficher le titre
    2. Afficher le slogan
    3. Afficher le bouton 1
    4. Afficher le bouton 2
    5. Afficher les flèches : Affiche des flèches de défilement droite/gauche pour l’utilisateur.
    6. Lecture automatique : Active la lecture automatique du diaporama. Les images défileront en fonction de la vitesse déterminée plus bas. Si cette fonction est désactivée, l’utilisateur devra faire défiler lui-même les diapositives.
    7. Vitesse de la lecture automatique (ms) : Permet de régler la vitesse (en millisecondes) du défilement automatique des diapositives.
    8. Flèche de défilement : Au bas du carrousel, affiche une flèche de défilement vers le bas pour inciter l’utilisateur à défiler sur la page.
    9. Hauteur du diaporama : Détermine une hauteur maximale pour le diaporama. Réglez votre hauteur en fonction des différents types d’appareil :
      1. Hauteur en mobile
      2. Hauteur en tablette
      3. Hauteur en ordinateur
    10. Couleur de la flèche de défilement : Détermine la couleur de la flèche de défilement vers le bas.
    11. Ancre de la flèche de défilement : Permet de diriger vers une section de la page.
    12. Afficher les points de navigation : Au bas du carrousel, s’afficheront des petits points de navigation représentant les diapositives du carrousel.
    13. Afficher les titres des diapositives : Au bas du carrousel, s’afficheront les titres des diapositives et serviront de boutons pour naviguer à travers les diapositives.
  12. Lorsque l’élément Diaporama est complet, sauvegardez.
2666