Les diaporamas également appelés carrousels ou slideshows permettent de présenter des informations sous forme d'images placées dans un large espace en tête de page. Sur le webkit, deux versions de carrousel sont proposées par défaut : en version large (pleine page) ou en version bloc (60% de la page). Cette documentation a pour but d'expliquer comment utiliser ces deux types de carrousels.

Création d'un carrousel

Il faut créer autant de contenus de type Carrousel (ou carrousel ou slideshow) que d'images dans le diaporama. Si vous souhaitez présenter 5 visuels, vous devrez donc créer 5 contenus de type Diaporama.

  1. Allez dans Contenu > Ajouter du contenu > Carrousel
  2. Donnez un titre à votre image
  3. Remplissez ou non le champ Body
  4. Uploadez votre image depuis votre ordinateur en faisant Parcourir puis Tranférer.
  5. Rentrez le lien de la page vers laquelle pointe votre image dans le champ Lien
  6. Certains diaporamas permettent d'apposer un bandeau sur l'image, correspondant à son titre (renseigné à l'étape 2). Si vous souhaitez que ce bandeau s'affiche, cochez "oui" dans le champ Afficher titre
  7. ​Enregistrez

Affichage du carrousel en mode bloc

Ceci est le comportement par défaut du Carrousel. Il est donc positionné ainsi à la liviraison de votre webkit et vous n'avez normalement rien à faire.

Si vous souhaitez revenir à ce comportement par défaut après un changement, allez dans Structure > Blocs.

L'interface de gestion des blocs propose deux blocs carrousels : l'un s'appelle View: Carrousels: Bloc column display, l'autre View: Carrousels: Bloc wide display

Le bloc View: Carrousels: Bloc column display correspond à l'affichage en mode bloc. Il suffit donc de paramétrer ce bloc en le plaçant dans la région Contenu et en le positionnant sur la page d'accueil (voir notre documentation sur les blocs).

Pensez à enregistrer.

Affichage du carrousel en mode pleine page

L'affichage en pleine page n'est pas le comportement par défaut du carrousel à la livraison de votre webkit, si vous souhaitez l'utiliser il faudra donc le paramétrer.

Allez dans Structure > Blocs.

L'interface de gestion des blocs propose deux blocs carrousels : l'un s'appelle View: Carrousels: Bloc column display, l'autre View: Carrousels: Bloc wide display

Le bloc View: Carrousels: Bloc wide display correspond à l'affichage en mode pleine page. Il suffit donc de paramétrer ce bloc en le plaçant dans la région Top content et en le positionnant sur la page d'accueil (voir notre documentation sur les blocs).

Pensez à enregistrer.

Ordre des visuels dans le carrousel

L'ordre pris en compte pour l'affichage des carrousel est la date de mise à jour du contenu
Vous pouvez donc remonter un slide en mettant "artificiellement" à jour votre contenu
Pour ce faire, il suffit de l'éditer et de l'enregistrer, la date de mise à jour sera celle du jour et le slide remontera en première position