Diaporamas

These slideshows can be added to your page from the Create > Content > Slideshows view when in Edit mode.

Le modèle Diaporama est similaire au modèle Liste, mais comporte des zones supplémentaires pour la configuration du comportement du widget de diaporama. La configuration inclut le type de transition, la durée, le démarrage automatique ou manuel, les temps de pause et les commandes à afficher. Le widget utilisé pour afficher le diaporama est un widget Dojo appelé dojox.widget.AutoRotator. Il effectue une rotation dans les éléments d'une liste, ajoutant une transition entre ces éléments. Content Template Catalog comporte des exemples qui affichent des images liées, mais la liste peut contenir n'importe quel type de contenu.

Les informations de configuration entrées dans l'élément de configuration Diaporama sont converties en paramètres pour le widget à l'aide d'une méthode JavaScript dans content.js. Ce code instancie également le widget Dojo.

Le style des diaporamas est complexe car ils disposent d'un conteneur de légende distinct qui est alimenté lors de sa rotation dans le diaporama. La légende est stockée dans un élément DIV masqué avec chaque diapositive et est ensuite copiée dans le conteneur visible par le biais des gestionnaires d'événements associés au widget.

L'exemple suivant illustre un diaporama publicitaire, avec des légendes de surcharge et des commandes de titre.

Cette image illustre un diaporama avec trois titres. Les légendes changent lorsque les utilisateurs cliquent sur un titre différent.

Ce second exemple illustre un diaporama de contenu avec des contrôles de numéro et des légendes formatées.

Cette image illustre un objet de contenu dans un diaporama. Les utilisateurs cliquent sur un numéro pour accéder à une autre partie du diaporama.

Configuration du diaporama

Chaque diaporama utilise un document de configuration basé sur le modèle de création Diaporama qui se trouve dans la bibliothèque Conception CTC. Les paramètres de configuration suivants sont utilisés par le diaporama :
Transition
Vous pouvez choisir parmi une gamme de transitions, notamment des fondus, des diapositives, des panoramiques et des volets.
Rotation
Sélectionnez le type de rotation à appliquer à un diaporama. Cela permet de déterminer la fréquence à laquelle les diapositives du diaporama sont affichées et dans quel ordre.
Durée de glissement
Ce paramètre détermine la durée d'affichage de chaque diapositive du diaporama avant l'affichage de l'image suivante.
Interrompre
La rotation d'un diaporama peut être arrêtée en utilisant les différentes méthodes proposées dans ce paramètre.
Contrôles
Plusieurs contrôles de diaporama peuvent être affichés en utilisant les différentes options de contrôle sélectionnées dans ce paramètre.
Hauteur
Ce paramètre détermine la hcréateur du diaporama.
Titre de liste
Certains modèles de liste incluent un titre dans leur conception d'en-tête. Le titre saisi ici est affiché dans ces modèles de liste.
Style CSS
Une grande partie de la conception de chaque diaporama est définie dans le fichier CSS associé à ce diaporama. Vous pouvez saisir ici le nom d'autres fichiers CSS pour modifier certains éléments de conception du contenu affiché dans le diaporama.
Composant de liste
Le composant de liste sélectionné ici définit le contenu affiché dans le diaporama.
Composant de présentation de liste
La présentation de liste sélectionnée ici définit la disposition de l'en-tête, du pied de page et du corps du contenu récupéré par le composant de liste.
Remplacement de contexte
Vous pouvez sélectionner un site, une zone de site et un objet de contenu à utiliser comme contexte par défaut du diaporama. Il est utilisé à la place du contexte du diaporama par défaut.
Modèles de liste
Certains composants de liste affichent du contenu qui utilise un modèle de création spécifique. Des modèles de création supplémentaires peuvent être spécifiés ici.
Catégories de liste
Certains composants de liste affichent du contenu profilé avec des catégories spécifiques. Des modèles de création supplémentaires peuvent être spécifiés ici.