widget: Table

widget Catégories : Basic

Le widget Tableau vous permet d'afficher des données textuelles sous la forme d'un tableau composé de lignes et de colonnes. Vous pouvez ajouter du contenu au tableau en effectuant un copier-coller d'un tableau existant, en utilisant l'éditeur ou en téléchargeant un fichier au format CSV.

Remarque

  • Vous pouvez télécharger un fichier CSV exporté ou copié à partir de Google Sheets ou d'Excel (uniquement pour les langues se lisant de gauche à droite).

  • Le tableau ne peut contenir que du texte et des liens. Utilisez des lignes et des colonnes ou le widget Liste pour créer un tableau avec des images, des boutons ou d'autres widgets.

  • Dans la version 17 de Edge, l'éditeur de tableau ne peut pas être ouvert. Cependant, il fonctionne correctement dans Edge 18.

  • Le tableau peut inclure jusqu'à 30 lignes et 30 colonnes.

  • Lorsqu'il est connecté à des données, la limite de ligne est la limite du type de collection. Pour plus d'informations, voir Contenu dynamique : Collections.

Contenu dynamique

Ce widget peut également afficher des pages dynamiques (affichage uniquement, le lien direct n'est pas disponible). Pour plus d'informations, voir Contenu dynamique : Options d'affichage et de navigation pour les notices de collection.

Éditeur de contenu

Il existe trois façons d'ajouter des données à votre tableau :

  1. Les saisir dans l'éditeur.

  2. Copier-coller un tableau existant.

  3. Télécharger un fichier au format CSV.

    24517235701655-table_widget2_en.gif

Utilisez l'option Effacer tout pour effacer toutes les données de votre tableau.

Rédacteur en chef de la conception

  • Avec l'éditeur de design, vous pouvez personnaliser la bordure du tableau, la barre de titre, la couleur d'arrière-plan et le style de texte pour l'en-tête, les lignes et la première colonne. Vous pouvez également personnaliser la direction et l'alignement du texte pour l'ensemble du tableau, mais pas pour des cellules individuelles.

  • La première colonne peut être personnalisée de façon à avoir sa propre couleur de fond, police, taille et couleur.

  • Les couleurs des lignes paires et impaires peuvent également être personnalisées pour faciliter la lecture des données.

  • La largeur des colonnes peut être définie comme uniforme ou dépendant de la largeur du titre (auquel cas les colonnes sont susceptibles de ne pas être égales entre elles).

Sur mobile, vous pouvez sélectionner l'un des affichages suivants :

  • Squish. Il est préférable d'utiliser cette option si vous avez 2 ou 3 colonnes, afin d'adapter votre contenu à la largeur de l'écran.

  • Parchemin. Il est préférable d'utiliser cette option si vous avez de nombreuses colonnes. Vous pouvez également redimensionner le site widget et afficher un défilement vertical si le tableau est trop long.

  • Effondrement. Une autre façon détaillée de présenter vos données, nous vous recommandons de ne pas choisir cette mise en page si vous avez trop de lignes.

Exemples

Ingrédients alimentaires :
24517245627415-example_2.png
Liste de contacts :
24517219933079-example_4.png
Tableau des prix :
24517202716439-example_3.png
Tableau des arômes :
24517231290391-example_1.png

Ajouter des données connectées

Vous pouvez afficher les données d'une collection dans un widget Tableau. Ce widget permet de connecter n'importe quel type de collection : interne, externe, Google Sheets, Airtable ou des images. L'utilisation de tableaux connectés vous permet de créer des sites plus rapidement à l'aide de modèles connectés. Vous pouvez également modifier des données directement dans Google Sheets ou Airtable au lieu de devoir utiliser l'éditeur de contenu du widget Tableau.

Si une page dynamique est connectée à la même collection que le tableau, elle sera automatiquement reliée au tableau. Vous pouvez accéder à l'élément de la page dynamique en cliquant sur la ligne du tableau.

Remarque

Pour plus d'informations sur les données connectées, reportez-vous à la section Vue d'ensemble du contenu dynamique.

Les tableaux connectés prennent en charge les types de champ suivants :

  • Texte brut

  • Texte brut

  • Image

  • Lien

  • Numéro

  • Date et heure

  • E-mail

  • Sélection multiple

  • numéro de téléphone

Connecter le widget de table

Pour connecter un widget Tableau à une collection :

  1. Effectuez un clic droit sur le widget Tableau.

  2. Dans le menu contextuel, cliquez sur Connecter aux données.

  3. Sélectionnez une collection dans le menu déroulant.

  4. Sélectionnez les champs requis dans la liste déroulante Champs à afficher. Les colonnes seront classées dans le même ordre que celui dans lequel elles ont été sélectionnées.

  5. Cliquez sur Terminé.

Une fois la connexion aux données de la bibliothèque de contenu réussie, le tableau widget sera marqué d'une icône bleue de données connectées (connected_data_icon.png) bleue.