Comment créer un carrousel d'images

Exemple de carrousel (Afficher l'image au complet)

Le présent tutoriel explique comment créer un carrousel d'images sur votre site Web.

Prérequis

Le module Dynamic View doit être activé sur votre site. S'il n'est pas déjà activé sur votre site et que vous n'avez pas accès à la page des modules, veuillez présenter une demande au moyen du formulaire d'assistance auprès du Centre de services afin qu'un membre de l'équipe de soutien Web active le module pour vous.

 

 

1. Création du terme taxonomique représentatif du carrousel

  • Allez à « Structure », puis cliquez sur « Taxonomie ».
  • Repérez la rangée « Content Groups » et cliquez sur le lien « Ajouter des termes ».
  • Dans la page qui suit, saisissez le nom de votre terme en anglais dans le champ Titre. On conseille de suivre le format « Nom de page - Section » pour faciliter la reconnaissance du terme. À titre d'exemple, « Home - Slideshow ». La traduction du terme est optionnelle.

2. Création des publications à la une dans le carrousel

  • Allez à « Contenu ».
  • Cliquez sur « Ajouter du contenu », puis sélectionnez « Content Link » (Lien de contenu).
    • Saisissez un titre anglais et un titre français. Ce titre sera affiché sur l'image.
    • Saisissez un lien anglais et un lien français. Ce lien devrait mener vers une page interne ou externe contenant de plus amples renseignements.
    • Cliquez sur le bouton « Primary Image » (Image principale) pour préciser l'image de la publication.
    • Sous la section « Content Groups » (Groupes de contenu), sélectionnez le terme que vous aviez créé à l'étape 1.
  • Sauvegardez et répétez cette étape pour toute autre publication que vous souhaitez mettre à la une.

3. Création du carrousel

  • Allez à « Structure » et ensuite « Pages ».
  • Modifiez la page sur laquelle vous souhaitez ajouter le carrousel (par exemple, la page d'accueil).
  • Dans le menu de gauche, cliquez sur « Contenu ».
  • Cliquez sur la roue dentée située dans le coin supérieur gauche de la région où vous souhaitez placer le carrousel. À partir du menu déroulant, cliquez sur « Ajouter du contenu ».
  • Une nouvelle fenêtre s'affichera. Sélectionnez « Contenu » dans le menu de gauche, puis cliquez sur le lien « Liste de contenu dynamique ».
  • Dans la page qui s'affiche, saisissez les paramètres suivants :
    • Display Mode: List
    • Cliquez sur l'onglet « Source Settings » à la gauche, puis saisissez les valeurs suivantes :
      • Entity Type : Content
      • Sub-Type : Content Link
      • View Mode (Results) : Link Block with Image
    • Cliquez sur l'onglet « Filters » à la gauche, puis saisissez les valeurs suivantes :
      • Filter Method : Field (Taxonomy Reference)
      • Taxonomy Term(s) : Choisissez le terme que vous aviez créé à l'étape 1.
    • Cliquez sur l'onglet « Sorters » à la gauche, puis saisissez les valeurs suivantes :
      • Sorting Method: Nodequeue Order
      • Queue : Content Group Queue
      • Subqueue : Choisissez le terme que vous aviez créé à l'étape 1.
    • Cliquez sur l'onglet « Pager » à la gauche, puis saisissez les valeurs suivantes :
      • Items per page : 5
      • Hide the pager : Cochez cette case.
  • Cliquez sur le bouton « Finish » (Terminer).

4. Ajout de style au carrousel

  • Cliquez sur la roue dentée située dans le coin supérieur droit du carrousel que vous venez d'ajouter. Dans le menu déroulant, sous la section Style, cliquez sur « Changer ».
  • Une nouvelle fenêtre s'affichera. Sélectionnez « Component Styles » (Styles de composants), puis cliquez sur le bouton Suivant.
  • Dans la page suivante, configurez les paramètres suivants :
    • Format : Slideshow
    • Container Type : Teaser
    • Summary : Hidden
    • Title Position : Absolute Bottom
  • Cliquez sur le bouton Sauvegarder pour conclure vos modifications. La fenêtre fermera.
  • Cliquez ensuite sur le bouton Mettre à jour et sauvegarder pour enregistrer vos changements.
» Envoyer vos commentaires
    Sujets: 
  • Soutien
    Types: 
  • Tutoriels
Haut de page