À propos de l'élément de contenu
Grâce à son design, l'infobox indique au visiteur de la page qu'il y a ici des indications dont il doit tenir compte.
Selon le choix de la couleur et de l'icône , il saisit l'importance de l'information.
Cela fonctionne particulièrement bien si l'infobox est utilisée sur l'ensemble du site Web conformément à sa destination.
- Pour l'infobox, le choix de la couleur se rapporte au cadre et au fond de l'icône en haut à gauche.
- L'arrière-plan est toujours blanc
- Pour des raisons de compatibilité avec les anciens contenus, des images sont représentées, mais elles ne sont souvent pas utiles.
Utilisation :
- complète le contenu de la page
- pour les remarques, les avertissements, les événements temporaires
- les titres H4 ou H5 doivent être utilisés (remarque : sera probablement limitée en conséquence).
- avec peu de texte, éventuellement avec un lien vers d'autres informations
- sans images
- il est recommandé de n'utiliser qu'une seule infobox par page
- l'infobox doit être plutôt petite
Étape 1 : Créer une boîte d'information
Pour créer l'élément, cliquez sur l'icône "+ contenu" dans la zone d'édition de la page de destination. Sélectionnez ensuite l'élément "Infobox" sous l'onglet "Texte". Le menu d'édition de l'élément s'ouvre ensuite automatiquement.
Étape 2 : Créer le contenu
Attribuez d'abord un titre sous l'onglet "Général". Définissez ensuite le type/la mise en page de l'en-tête. Les titres H4 et H5 sont utiles comme informations marginales dans les infoboxes.
Créez maintenant le contenu souhaité de l'infobox en bas dans l'éditeur de texte. Veuillez noter que la longueur du contenu influence également la taille de l'infobox.
Étape 3 : Sélectionner l'icône (facultatif)
Pour choisir une icône qui sera affichée en haut à gauche dans la boîte d'information, cliquez sous l'onglet "Général" sur le champ situé sous le libellé "Icône". Un menu déroulant s'ouvre alors dans lequel vous pouvez choisir une icône pour l'infobox. Dès que vous avez choisi une icône, une image d'aperçu correspondante apparaît dans la case à côté du champ. Vous trouverez un aperçu des icônes disponibles avec des images d'aperçu sur le site web de Fontawesome.
Si aucune icône n'est sélectionnée pour la boîte d'information, l'icône "info" est utilisée par défaut.
Etape 4 : Sélectionner la couleur du cadre (en option)
Pour définir une couleur de cadre pour l'infobox, allez d'abord dans l'onglet "Apparence". Là, sélectionnez la couleur de cadre souhaitée dans la zone "Couleur d'arrière-plan".
Si aucune couleur de cadre n'est sélectionnée pour l'infobox, la couleur de cadre "light-green" est utilisée par défaut.
Auto-apprentissage TYPO3
Exercice
- Créez une boîte d'information.
- Réfléchissez à une remarque que vous pourriez éventuellement mettre dans une boîte verte.
- Écrivez cette remarque dans l'infobox, mettez la couleur en vert.
- Veillez à ce que le niveau de l'en-tête soit H4/H5.
- Réfléchissez à une remarque que vous pourriez mettre dans une boîte rouge.
- Réfléchissez à une remarque qu'il serait judicieux de mettre dans une boîte bleue ou bleu-gris.