Carrousel

Bandeau défilant

Exemple de carrousel

Disponible sur...

Présentation

Cet article explique comment ajouter sur vos pages un composant “carrousel” sur vos pages afin d’afficher un bandeau contenant du texte et une image (souvent pour mettre en avant une information nouvelles ou importante).

Vidéo

Une vidéo explique les différents points abordés dans ce chapitre pour les sites :

Carrousel

Pour les sites si vous souhaitez seulement mettre une image décorative en haut de vos pages il faut utiliser le Bandeau image.

Ajout d'un nouveau composant Carrousel

1. Sur la page en mode , trouvez la section où vous souhaitez ajouter un composant Carrousel.

2. Cliquez sur le bouton "+ Contenu" pour ouvrir le sélecteur d'éléments. Attention le composant Carrousel ne peut être inséré que dans la section Avant le contenu (et pas Normale)

3. Sélectionnez Carrousel dans l'onglet Mise en page.

Pour les sites le composant est disponible dans l'onglet Contenus flexibles.

Configuration du composant

• Une fois que vous avez ajouté le composant, vous verrez une boîte de dialogue de configuration.

• Ajoutez un titre (optionnel)

• Choisissez un type (pour le titre)

• Ajoutez un lien (optionnel)

3- Cliquez sur + Créer nouveau pour créer un item de carrousel.

4- Saisissez (en fonction de votre plateforme) :

Pour les sites

• En-tête : Le titre qui s'affichera pour l'item du carrousel

• Texte : Le texte qui s'affichera pour l'item du carrousel

• Masquer l'en-tête et le texte : si coché les deux éléments précédents ne s'afficheront pas (c'est utile quand on veut faire un carrousel avec seulement des images décoratives)

• Image : choisissez l'image qui s'affichera dans le carrousel

• Bouton texte : si saisie cela créera un bouton à la fin du texte renvoyant vers le Lien

• Lien : Le lien vers lequel renverra le Bouton texte.

Pour les sites

• Type : Choisissez le type d'élément qui s'affichera dans le carrousel (la plupart du temps il faut choisir Texte et Image

Saisissez ensuite les différents champs en fonction de votre choix de type.

Pour les sites l'image de fond doit être renseignée dans la zone Image d’arrière-plan de l'onglet Arrière-plan (et pas dans la zone Image) de l'onglet Général.

5- Dans l'onglet Options du carrousel vous pouvez paramétrer la manière dont les différents items vont s'afficher.

6- Pour les sites vous pouvez également paramétrer dans l'onglet apparence le Type d'affichage de l'image (Image de fond ou Image en vignette) ainsi que la présence ou non des motifs Gustave Eiffel sur le texte et/ou l'image.

Pour que le carrousel prennent toute la largeur de la fenêtre et pas seulement la largeur du site il faut l’ajouter dans la zone Bandeau (ou Avant le contenu) et pas dans la zone Contenu principal (ou Contenu)

Exemples

Vous pouvez trouver des exemples d'utilisation du Contenu Carrousel :

Carrousels

FAQ

Mon carrousel affiche une erreur

Si votre carousel n’affiche plus d’images mais une erreur TYPO3 il est fort probable que cela soit du au fait qu’une des entrée du carousel ne contienne pas d’image.

En effet chaque entrée du carousel doit contenir une image (vu que c’est un carousel).

Il vous suffit donc de modifier l’entrée incorrecte en lui associant une image dans typo3 pour corriger le problème.