Gabarit "Koala Carousel 6"

Couleur de fond à gauche

  • Editer la portlet > Avancé : renseigner le champ "Couleur de fond"

Syntaxe avancé : vous pouvez renseigner une variable CSS pour que la couleur de fond suit le design system du site. Cela permet de garantir la cohérence globale et éviter des changements manuels lors de changement thème de coleur. Dans cet exemple, nous avons mis var(--koala-color-gray-standard-2)

  • Astuce : ne pas cliquer sur "Valider" mais cliquer en dehors pour valider puis enregistrer la portlet

  • Bon à savoir : cette syntaxe n'est pas encore supporté par Jalios, si vous ré-éditez, la couleur paramétrée est #000 mais l'enregistrement est bien effectué.

Affichage de numérotation

  • Par défaut, les éléments du carousel sont affichés sous forme de points, il est possible d'afficher la numérotation en éditant portlet

Format de l'image

  • Par défaut, le ratio de l'image est conservé et l'espace manquant autour est rempli par une couleur de fond.

  • Il est possible de paramétrer le format pour "zoomer" l'image et remplir toute l'espace. L'image sera tronquée sans être déformée. Editer la portlet > Image > Zoom

    • Nous recommandons des images 800x400 avec l'objet de présentation principale (les personnes, les bâtiments, la nature, ...) au centre

    • Quelques exemples d'image

Accessibilité

Si un habillage est paramétré, le titre de l'habillage est en h2 et le titre du carousel est en h3

Dans le cas où l'habillage n'est pas paramétré pour une raison graphique, on a besoin d'avoir un titre h2 visible seulement pour les lecteurs d'écrans. Pour cela, il faut activer l'option la portlet > Accessibilité > Heading H2 : Oui

Image et performance

PrécédentGabarit "Koala Carousel 4"SuivantGabarit "Koala Carousel 6 - Image pleine"

Mis à jour