Le widget Table des matières de Elementor Pro organise automatiquement le contenu de votre page en fonction des niveaux de hiérarchie H1 à H6. Bien que le processus soit automatique, vous avez beaucoup de contrôle sur ce qui est inclus et ce qui est exclu de l’affichage.
Contenu
Table des matières
Titre : saisissez le texte du titre affiché au-dessus de la table des matières
Balise HTML : sélectionnez la balise HTML à utiliser pour le titre, de H2 à H6, ou div
Inclure | Exclure
Comprendre
Ancres par balises : cliquez pour sélectionner les balises H1-H6 de la page à inclure automatiquement
Conteneur : ce contrôle limite la table des matières aux éléments de titre sous un conteneur spécifique
Exclure
Ancres par sélecteur : entrez les sélecteurs CSS à exclure, dans une liste séparée par des virgules
Affichage des marqueurs : choisissez d’afficher des numéros ou des puces à côté des éléments de la liste
Icône : (disponible uniquement si la vue Marqueur est définie sur Puces) . Cliquez sur la bibliothèque d’icônes pour choisir une icône ou sur Aucun pour n’utiliser aucune icône de puce.
Options additionelles
Word Wrap : faites glisser vers Oui pour activer Word Wrap, pour habiller le texte lorsque la largeur de colonne ne peut pas accueillir de texte long sur une ligne
Réduire la zone : faites glisser vers Non pour afficher la table des matières entièrement développée ou Oui pour forcer un clic pour développer une zone de table des matières réduite
Icône : cliquez sur la bibliothèque d’icônes pour choisir une icône dans la bibliothèque d’icônes qui s’affichera lorsque le widget est réduit pour indiquer que l’utilisateur doit cliquer pour développer le widget. Cliquez sur Aucun pour ne pas afficher d’icône. Cliquez sur Télécharger SVG pour télécharger votre propre icône SVG.
Réduire l’icône : cliquez sur la bibliothèque d’icônes pour choisir une icône dans la bibliothèque d’icônes qui s’affichera lorsque le widget est complètement développé pour indiquer que l’utilisateur doit cliquer pour réduire le widget. Cliquez sur Aucun pour ne pas afficher d’icône. Cliquez sur Télécharger SVG pour télécharger votre propre icône SVG.
Minimisé Activé (disponible uniquement si Minimize Box est défini sur Oui) : sélectionnez cette option pour réduire sur mobile , tablette ou aucun
Vue hiérarchique : faites glisser vers Oui pour afficher les éléments de la liste avec indentation basée sur la hiérarchie des balises
Réduire les sous-éléments : (disponible uniquement si la vue hiérarchique est définie sur Oui) L’option « Réduire » ne doit être utilisée que si la table des matières est rendue collante. Faites glisser vers Oui pour réduire les listes imbriquées et n’afficher que les éléments de niveau supérieur
Style
Boîte
Couleur d’arrière-plan : choisissez une couleur d’arrière-plan pour l’ensemble de la zone Table des matières
Couleur de la bordure : choisissez une couleur pour la bordure de la boîte
Largeur de la bordure : définissez la largeur de la bordure de la boîte
Rayon de la bordure : définissez le rayon de la bordure pour contrôler l’arrondi des coins
Remplissage : modifiez les paramètres de remplissage du widget
Hauteur minimale: définissez la hauteur minimale du widget
Ombre de boîte : définir les options d’ombre de boîte
Entête
Couleur d’arrière-plan : choisissez une couleur d’arrière-plan pour l’en-tête
Couleur du texte : choisissez une couleur pour le texte de l’en-tête
Typographie : modifiez les options de typographie pour le texte d’en-tête
Couleur de l’icône : choisissez la couleur de l’icône Développer / Réduire
Largeur du séparateur : définissez l’épaisseur de la bordure inférieure de l’en-tête du widget
liste
Typographie : modifiez les options de typographie pour le texte des ancres
Indentation : définissez le niveau de retrait des ancres
Normal | Hover | actif
Les options suivantes peuvent être définies indépendamment pour les états normal, survolé et actif.
Couleur du texte : choisissez une couleur pour le texte d’ancrage
Souligner : sélectionnez Oui pour souligner le texte d’ancrage
Marqueur
Couleur : choisissez une couleur pour le marqueur
Taille : modifiez la taille du marqueur si vous souhaitez qu’il soit d’une taille différente de celle du texte
Source : https://docs.elementor.com/article/615-table-of-content-pro
