Widget de table d'élémenteur gratuit
Elementor n'a pas de widget de table propre, dans la version gratuite ou pro. Dynamic Table est un widget Master Addons gratuit qui comble cet écart : vous ajoutez des cellules d'en-tête et des cellules du corps dans le panneau Elementor, et il crée une véritable table HTML que vous pouvez styler sans code. Les cellules peuvent contenir du texte, une icône ou une image, fusionner entre des colonnes ou des lignes et extraire des valeurs des balises dynamiques. Il est souvent utilisé pour les horaires, les fiches techniques, les listes de prix et les répertoires. Considérez-le comme une simple table de données pour les lignes que vous entrez à la main. Il ne trie, ne recherche ni n'importe de fichiers.
Construisez des lignes et des colonnes dans le panneau
Le tableau provient de deux répéteurs. Cellule d'en-tête de tableau contient un élément par colonne, et Tableau Cellule du corps tient chaque cellule dans l'ordre de lecture, avec un Nouvelle rangée? commutateur qui démarre la ligne suivante Vous pouvez faire glisser des éléments pour les réorganiser, dupliquer une cellule ou masquer la ligne d'en-tête avec le Tête de table interrupteur.
- Cellules fusionnées : Envergure de la colonne sur les cellules de l'en-tête et du corps, et en envergure sur les cellules du corps.
- Largeur de la colonne : activez la largeur personnalisée dans l'onglet Options d'une cellule pour définir sa largeur.
- Options de texte par cellule : alignement (gauche, centre, droite ou justify) et décoration (souligné, en ligne ou en ligne).
En-tête et style corporel
Style d'en-tête de table définit l'arrière-plan de l'en-tête (marine sombre par défaut), la couleur du texte, la taille et la couleur des icônes, l'alignement, la typographie et le remplissage des cellules internes. Tableau Corps a les mêmes contrôles pour les cellules de données, plus le remplissage autour des icônes.
- En-tête : arrière-plan, couleurs du texte et des icônes, taille des icônes, alignement, typographie et remplissage des cellules.
- Corps: arrière-plan, couleurs de texte et d'icônes, taille et remplissage des icônes, alignement, typographie et remplissage des cellules.
- Alignement par appareil : l'alignement de l'en-tête et du corps peut changer sur tablette et mobile.
Texte, icônes, images et balises dynamiques dans les cellules
Chaque en-tête et cellule corporelle a un taper à la option : Aucune, Icône ou Image Les icônes proviennent de la bibliothèque d'icônes Elementor, et les images obtiennent une Taille d'image en pixels Les champs de texte acceptent les balises dynamiques, y compris celles de la version gratuite Balises dynamiques extension, pour qu'une cellule puisse afficher un titre de publication, un champ personnalisé ou des détails sur l'auteur Chaque balise remplit une cellule Le widget ne boucle pas à travers les publications pour créer des lignes pour vous.
- Icônes comme coches : utilisez une tique ou une icône croisée dans les comparaisons de plans ou de fonctionnalités.
- Petites images: ajouter une photo ou un logo à côté d'un nom, dimensionné en pixels.
- Tags dynamiques : tirez sur des valeurs uniques telles que le titre du message ou un champ personnalisé.
Style global : rayures, frontières et coins
Style mondial s'applique à toute la table. Table rayée? est activé par défaut avec une couleur de bande gris clair (#eee) que vous pouvez modifier. Vous définissez également une table Couleur d'arrière-plan, Rembourrage de cellules intérieures, une bordure avec type, largeur et couleur, et Rayon de bordure pour les coins arrondis.
- Rangées zébrées : continuez à rayer sur les tables longues afin que les rangées soient faciles à suivre.
- Frontières: lignes pleines, pointillées, pointillées ou doubles autour des cellules.
- Coins arrondis: Border Radius adoucit le bord de la table.
Table réactive sur mobile
Tableau réactif? Se trouve dans la section Paramètres et est activé par défaut. Sur les appareils jusqu'à 768 px de largeur, la ligne d'en-tête est masquée, chaque ligne devient une carte et chaque cellule affiche le nom de sa colonne sous la forme d'une étiquette. Un calendrier de cinq colonnes se transforme en une liste de cartes que vous faites défiler vers le bas, de sorte que personne n'a à faire défiler de côté.
- Cartes empilées : Une carte par ligne, avec le nom de colonne à gauche et la valeur à droite.
- Alignement par appareil : L'alignement des en-têtes et du corps a leur propre tablette et valeurs mobiles.
- Éteignez-le : Le tableau garde sa grille sur les téléphones. Les tableaux larges passent ensuite au-delà du bord de l'écran, alors gardez-les à trois ou quatre colonnes.
Code de table HTML par rapport au widget de table dynamique
Sans widget de table, la façon habituelle d'ajouter une table dans Elementor est d'écrire le HTML vous-même dans un widget HTML Voici comment cela se compare avec le widget.
| Caractéristique | Widget HTML avec votre propre code | Tableau dynamique Master Addons |
|---|---|---|
| Prix | Gratuit (Cœur de l'élément) | Gratuit |
| Construire des lignes et des colonnes | Écrire des balises table, tr et td | Répéter les éléments dans le panneau |
| Style | Votre propre CSS | Contrôles des onglets de style |
| Cellules fusionnées | attributs colspan et rowspan | Champs de portée de colonne et de portée de rangée |
| Icônes et images dans les cellules | Collez le balisage | Bibliothèque d'icônes ou médiathèque |
| Tags dynamiques | Non | Oui, une valeur par cellule |
| Disposition téléphonique | Vos propres requêtes médias | Les lignes s'empilent dans les cartes |
| Tri, recherche, importation CSV | A besoin d'un script ou d'un plugin | Non |
Si vous avez besoin d'un tri, d'une recherche, d'une pagination ou d'une importation CSV, un plugin de table dédié tel que TablePress est le meilleur choix Pour une table stylée que vous modifiez à l'intérieur d'Elementor, le widget vous sauve en écrivant HTML et CSS.
Connexes: Tableau des prix (gratuit), Tableau comparatif (Pro) et Balises dynamiques (gratuit).
Ce que ce widget de table de données Elementor peut et ne peut pas faire
La table dynamique est une table de données pour les lignes que vous saisissez. Voici ce qu'il fait et où il s'arrête.
| Caractéristique | Tableau dynamique |
|---|---|
| Lignes et colonnes saisies dans le panneau | Oui |
| Cellules fusionnées (souris de colonne et portée de ligne) | Oui |
| Icônes et images dans les cellules | Oui |
| Tags dynamiques | Oui, une valeur par cellule |
| rangées de lignes | Oui |
| Largeur de colonne personnalisée | Oui |
| Empilage mobile | Oui, à 768px et moins |
| tri | Non |
| Recherche | Non |
| pagination | Non |
| Importation CSV ou Excel | Non |
De quel outil de table avez-vous besoin ?
Le tableau signifie plusieurs choses différentes dans les recherches d'Elementor. Choisissez l'outil par ce que vous construisez.
| Ce que vous construisez | Meilleur outil |
|---|---|
| Un tableau simple comme un calendrier, une fiche technique, une liste de prix ou un calendrier | Tableau dynamique |
| Grandes données nécessitant le tri, la recherche, la pagination ou une importation CSV | TablePress, placé avec le widget de code court Elementor |
| Plans et prix côte à côte | Tableau des prix |
| Une comparaison de fonctionnalités entre les plans ou les produits | Tableau comparatif (Pro) |
| Heures d'ouverture | Heures d'affaires |
Connexes: Accordéon avancé Pour des réponses longues qui ne rentreraient pas dans une cellule, et Balises dynamiques Pour remplir les cellules à partir des données de publication.
Exemples de tables Elementor
Les trois tableaux ci-dessous sont des widgets de table dynamiques en direct, et non des captures d'écran. Ouvrez cette page sur un téléphone pour voir chacune des piles dans les cartes. Plus de mises en page, y compris un menu de restaurant et une comparaison de plans, sont dans la visionneuse de démonstration en dessous.
Horaire des cours
Un horaire hebdomadaire avec cinq colonnes. Sur un téléphone, chaque classe devient sa propre carte.
| Temps | Classe | Instructeur | studio | Espaces |
|---|---|---|---|---|
| Lun 07h00 | Flux de vinyasa | Alina Petrova | Studio 1 | 4 à gauche |
| Lun 18h30 | Force & conditionnement | Dan Osei | Plancher de gymnastique | Plein |
| Mar 09h30 | Réformateur Pilates | Marta Silva | Studio 2 | 2 gauche |
| Mer 12h15 | Exprimer HIIT | Dan Osei | Plancher de gymnastique | 9 à gauche |
| Jeu 19h00 | Yin & restaurer | Alina Petrova | Studio 1 | 11 à gauche |
| Samedi 10h00 | Débutants barre | Yara Haddad | Studio 2 | 6 à gauche |
Exigences du système
Trois colonnes comparant les valeurs minimales et recommandées, la forme habituelle d'une fiche technique.
| Composant | minimum | Recommandé |
|---|---|---|
| wordpress | 6.0 | 6.6 ou plus récent |
| PHP | 7.4 | 8.2 |
| Élémenteur | 3.16 | 4.2 ou plus récent |
| MySQL/MariaDB | 5,7 /10,3 | 8,0 /10,6 |
| Limite de mémoire PHP | 128 Mo | 256 Mo |
| max_input_vars | 1000 | 3000 |
| https | Facultatif | Nécessaire pour les contrôles de licence |
Tarifs d'expédition
Une liste de prix par destination et service, avec des rayures désactivées et un en-tête léger.
| destination | service | Délai de livraison | Libre de | Coût |
|---|---|---|---|---|
| Royaume-Uni continent | Royal Mail suivi 48 | 2 3 jours ouvrables | 40 £ | 3,95 £ |
| Royaume-Uni continent | DPD le lendemain | Jour ouvrable suivant | 120 £ | 6,95 £ |
| Hautes terres et îles | Royal Mail suivi 48 | 3 3 jours ouvrables | 60 £ | 7,50 £ |
| République d'Irlande | DPD Irlande | 2 4 jours ouvrables | 150 £ | 11,00 £ |
| UE | DHL Europe | 3 3 jours ouvrables | — | 14,50 £ |
| Reste du monde | DHL Express | 5 10 jours ouvrables | — | 24,00 £ |
Comment faire une table en élément
Dans le panneau Élémenteur, le widget s'appelle Tableau dynamique.
- Installez Master Addons pour Elementor et vérifiez cela Tableau dynamique est activé dans les paramètres du widget Master Addons.
- Modifiez votre page avec Elementor, recherchez Tableau dynamique et faites-le glisser Cela commence par un exemple de tableau à quatre colonnes.
- Dans Tête de table, ajoutez-en un Cellule d'en-tête de tableau par colonne et tapez chacune Nom de la colonne.
- Dans Tableau Corps, ajoutez un élément par cellule de gauche à droite Allumez Nouvelle rangée? sur la première cellule de chaque ligne après la première.
- Utilisation Vague de colonne ou Portée de la rangée dans l'onglet Options d'une cellule pour fusionner les cellules.
- Stylez la table dans l'onglet Style et laissez Tableau réactif? sur la pile de lignes sur les téléphones, puis mettez à jour la page.
Foire aux questions pour la table dynamique
Y a-t-il un widget de table dans Elementor ?
Pas dans Elementor lui-même, gratuit ou Pro. Master Addons en ajoute un gratuitement : le widget Dynamic Table construit le tableau à partir des cellules d'en-tête et de corps dans le panneau.
La table est-elle réactive sur les appareils mobiles ?
Oui, avec Table réactive ? allumée, qui est la valeur par défaut Sur les appareils jusqu'à 768 px de large chaque ligne se met dans une carte et chaque cellule affiche son nom de colonne comme étiquette Éteignez-la pour garder la disposition normale de la table sur les téléphones.
Puis-je utiliser des données dynamiques dans les cellules ?
Oui, une valeur par cellule Le texte de l'en-tête et du corps accepte les balises dynamiques, y compris les balises dynamiques gratuites des modules complémentaires principaux telles que le titre de la publication, le champ personnalisé et les informations sur l'auteur. Le widget ne crée pas de ligne pour chaque publication, donc chaque ligne est toujours construite à la main.
Elementor Pro a-t-il un widget de table ?
non .Elementor Pro ajoute un widget de tableaux de prix pour les plans, mais ni le plugin de base ni le pro ne disposent de widget pour les lignes et les colonnes de données. Vous avez besoin d'un widget d'addon tel que Dynamic Table, un plugin de table ou votre propre HTML.
Puis-je créer une table dans Elementor sans plugin ?
Oui. Collez le tableau HTML dans le widget HTML et mettez-le en style avec votre propre CSS, ou disposez les lignes avec un conteneur de grille. Les deux fonctionnent pour de petites tables, bien que chaque modification signifie modifier le code ou de nombreux widgets distincts.
Que se passe-t-il si j'ajoute un texte très long dans une cellule ?
Le texte s'enroule à l'intérieur de la cellule Activez la largeur personnalisée dans l'onglet Options de la cellule pour corriger la largeur de la colonne et augmentez le remplissage de la cellule intérieure si les lignes semblent exiguës.
Puis-je mettre en évidence une colonne, comme un plan populaire ?
Pas avec un seul réglage Les couleurs s'appliquent à tout l'en-tête ou à tout le corps Pour les tableaux plans, le Tableau des prix widget (gratuit) a une option Highlight, et le Tableau comparatif widget (Pro) est construit pour les comparaisons de plans.
Puis-je trier, rechercher ou importer un CSV dans la table ?
Non. Le widget n'a pas de tri, de recherche, de pagination ou d'importation CSV. Pour ceux-ci, utilisez un plugin de table de données tel que TablePress et placez son shortcode sur la page.
Puis-je utiliser TablePress à l'intérieur d'Elementor ?
Oui. Construisez la table dans TablePress, copiez son shortcode, par exemple [ table id=1 /], et collez-le dans le widget Elementor Shortcode. Cet itinéraire convient aux longues tables qui nécessitent un tri, une recherche ou une pagination.
Puis-je coller un tableau d'Excel ou de Google Sheets ?
non . Chaque cellule est un élément distinct dans le panneau, donc un bloc collé atterrit dans une cellule. Entrez les cellules une par une, ou importez le fichier dans TablePress, qui lit les fichiers CSV et Excel.
Widgets et extensions d'éléments tendance
Construisez des sites Web sophistiqués en moins de temps.
Glassmorphisme
Extras de conteneurs
Modèles
![Modules principaux Extension de duplicateur de messages/pages pour le lien de ligne Elementor : MA Duplicator dans la liste des pages WordPress créant une ébauche de page de destination - [Dupliqué n° 128]](https://d1asvmc6qcowgk.cloudfront.net/wp-content/uploads/2026/09/15102930/post-page-duplicator-768x403.webp)
Duplicateur de messages/pages
