Le carrousel

Qu’est-ce que le carrousel ?

Le carrousel est une zone de défilement de photos présente en page d’accueil de votre site. Cette zone est optionnelle, elle apparaît uniquement si vous décidez d’y insérer des photos.

Les photos peuvent servir à illustrer vos principales activités, prestations, réalisations… Nous vous recommandons de ne pas en insérer plus de 5 à 6.

Le carrousel peut également servir à mettre en avant de manière ponctuelle un nouveau produit, un événement, ou une actualité particulière.

Les photos du carrousel peuvent afficher (au maximum) :

  • une photo
  • un titre (optionnel)
  • un sous-titre (optionnel)
  • un bouton permettant d’accéder à une URL (adresse web) précise. Le plus souvent ce lien se fait vers une page de votre site. Les liens internes étant valorisés par les moteurs de recherche, n’hésitez pas à utiliser cette possibilité.

Voici ci-dessous, un exemple de photo dans le carrousel du site Maison des montagnes créé avec 6temFlex.

Cette photo comprend un titre « Découvrez Bagnères de Bigorre », un sous-titre « Sports d’hiver, randonnées pédestres… » et enfin un bouton “En savoir plus” qui envoie vers la page “Activités du site”.

Titre, sous-titre et bouton situés au centre du slide

Titre, sous-titre et bouton situés au centre de la photo

RondsSlideLe nombre de ronds (visibles en bas à droite de la photo) correspond au nombre de photos présentes dans le carousel. Dans l’exemple ci-dessus, le carousel compte 2 photos. Le rond coloré en rouge correspond à la photo affichée et indique sa position dans le défilement du carousel (ci-dessus, la photo est en deuxième et dernière position).

Remarque : l’outil de personnalisation vous permet de choisir la couleur du bouton. La couleur du rond représentant la photo active sera alors identique à celle choisie pour le bouton.

Insérer une photo dans le carrousel

Pour ajouter une photo dans le carrousel, rendez-vous dans la rubrique « Carrousel » puis sur « Ajouter une photo ».

AjoutPhotoCarrousel

Si vous souhaitez insérer un titre sur votre photo, saisissez-le dans le champ 1 réservé à cet effet (le titre est optionnel).

Pour insérer une photo, cliquez sur le lien « Choisir une photo » présent dans le bloc « Cadrage de la photo » (zone 2).

Une fenêtre s'ouvre et affiche les onglets :

  •  « Envoyer des fichiers »
  •  « Bibliothèque de médias » : cette bibliothèque regroupe l’ensemble des médias que vous avez déjà inséré dans votre espace d’administration et qui sont utilisables pour votre site.

Si la photo que vous souhaitez insérer n’est pas dans votre bibliothèque de médias, vous pouvez l’ajouter via l’onglet « Envoyer des fichiers ». Cliquez sur le bouton “Sélectionner des fichiers” pour accéder alors aux fichiers de votre ordinateur. Sélectionnez ensuite la photo de votre choix.

EnvoyerFichiers

Sinon, parcourez la « Bibliothèque de médias », sélectionnez l'image à insérer et cliquez sur le bouton « Choisir ».

ChoixImageCarousel

ATTENTION : les photos insérées dans le carrousel doivent avoir une taille de 1140 * 500 minimum !

Une fois la photo choisie, elle s’affiche dans la zone « Cadrage de la photo ».

RedimensionnerSlideCarrousel

Vous pouvez la redimensioner la photo en cliquant sur le bouton « Redimensionner » (encadré ci-dessous en bleu) ou la supprimer en cliquant sur le lien « Supprimer » (encadré ci-dessous en rouge )

Informations complémentaires

Sous-titre

Si vous souhaitez insérer un sous-titre, saisissez-le dans le champ 3 réservé à cet effet.

Bouton

Si vous souhaitez insérer un bouton sur votre photo, saisissez ou copiez dans le champ 4 l'adresse web (ou url) de la page à atteindre.

Le champ 5 vous permet de choisir le libellé du bouton. Par défaut celui-ci est “En savoir plus” mais vous pouvez le modifier.

Affichage du titre et des informations complémentaires

La zone 6 vous permet de définir certaines options :

  • La position du titre, du sous-titre et du bouton : à gauche, au centre ou à droite de la photo
  • L’animation du titre, du sous-titre et du bouton, c’est-à-dire l’effet par lequel ils apparaissent sur la photo : du haut vers le bas, du bas vers le haut, de la gauche vers la droite ou de la droite vers la gauche

Lorsque votre photo est prête, cliquez sur le bouton “Publier” situé en haut à droite de votre fenêtre.

Modifier une photo

Pour visualiser tous les photos composant votre carrousel, rendez-vous dans « Carrousel » et cliquez sur « Carrousel ».

Liste des photos présentes dans le carrousel.

Liste des photos présentes dans le carrousel.

Pour modifier une photo, cliquez sur son titre. Vous pouvez aussi ajouter une photo en cliquant sur le bouton “Ajouter une photo” encadré en rouge ci-dessus.

Explications en vidéo

Choisir l’ordre d’apparition des photos du carrousel

Rendez-vous dans “Carrousel” -> “Carrousel“. Les photos sont classées par date de publication. Vous pouvez les ré-organiser par simple glissé / déposé. L'ordre de classement des photos correspond à leur ordre d'apparition dans le carrousel.

Les options du carrousel

Pour accéder aux options du carrousel, rendez-vous dans la rubrique “Carrousel” -> “Options”.

Les Options du carrousel

Défilement automatique des photos

Vous pouvez choisir d’activer ou non le défilement automatique des photos du carrousel et/ou que celui-ci se stoppe au survol d’une photo avec la souris.

Il est également possible de régler la vitesse de transition entre deux photos (en millisecondes) ainsi que durée d’affichage d’une photo (en millisecondes).

Taille des photos

Par défaut, la taille des photos dans le carousel est de 1140 * 500  pixels. Vous pouvez modifier cette taille.

Pour cela :

  1. saisissez la largeur et la hauteur souhaitées
  2. cliquez sur le bouton “Enregistrer” pour enregistrer ce format
  3. cliquez ensuite sur le bouton “Appliquer la nouvelle taille” pour que les images déjà insérées s’adaptent à ce nouveau format

Disposition générale de la page d’accueil

Notez qu’en fonction de la disposition générale choisie pour votre page d’accueil, le carousel peut occuper :

  • les 2/3 de la largeur du site, le dernier 1/3 étant occupé par la colonne latérale
  • les 3/3 de la largeur (toute la largeur de votre site)

 

Cette explication vous a-t-elle été utile ?
Oui   Non