TablePress : créer des tableaux dans WordPress sans une seule ligne de code

Parfois, l'administration d'un site WordPress peut être un jeu d'enfant par rapport au HTML statique et à d'autres gestionnaires de contenu préhistoriques. Les tâches courantes sont si faciles à mettre en œuvre que vous avez tendance à accueillir les demandes d'amélioration avec le sourire.

Il existe cependant certains types de requêtes qui ne manquent jamais de donner une éruption cutanée immédiate à de nombreux concepteurs de sites : toute requête qui inclut le mot « tableau » .

Ces petites bêtes sont si fragiles ! Une petite fausse manipulation, comme un « < » ou un « > » supprimé par erreur, et votre page en ligne perd sa belle structure géométrique pour ressembler aux ruines de Pompéi. C'EST TOUT CASSÉ !

Donc, si quelqu'un d'aventurier me demande d'ajouter une colonne, il s'attend à une série de jurons qui ferait rougir le capitaine Haddock.

Mais c'était tout avant ! Avant de découvrir le plugin qui permet de rester ZEN en toutes circonstances : TablePress . Un plugin qui permet de créer des tableaux dans WordPress sans coder , et de les modifier d'un simple glisser-déposer !

Une envie soudaine d'ajouter un tableau comparant vos plans tarifaires ou les caractéristiques de vos produits phares ? Suivez le guide. À la fin de ce didacticiel, vous serez en mesure d' ajouter des tableaux à WordPress en toute confiance .

Initialement écrit en février 2019, cet article a été mis à jour pour la dernière fois en mars 2022.

Vos meilleurs projets WordPress ont besoin du meilleur hébergeur !

WPMarmite recommande Bluehost : excellentes performances, excellent support. Tout ce dont vous avez besoin pour un bon départ.

Essayez Bluehost

Consultez nos guides détaillés sur le choix de votre nom de domaine et la création d'un site Web WordPress professionnel.

Qu'est-ce que Table Press ?

TablePress est un plugin gratuit et open-source qui vous permet de créer simplement des tableaux depuis votre interface d'administration WordPress, sans avoir besoin de coder.
Un shortcode permet ensuite de les ajouter où bon vous semble dans votre contenu (post, page, sidebar, etc.).

Capitalisant sur plus de 800K installations actives, et une note globale de 5 étoiles sur 5 sur l'annuaire officiel WordPress (pour plus de 4 200 avis), il n'y a aucun doute : c'est le plugin phare pour créer et gérer vos tableaux .

Le plugin a été créé par Tobias Bathge, un développeur WordPress allemand spécialisé dans la cyber-ingénierie. En bon geek, Bathge a créé TablePress dans une interface similaire à une feuille Excel .

Qu'est-ce que TablePress a à offrir ?

TablePress possède de nombreuses fonctionnalités intéressantes :

• Une interface intuitive par glisser-déposer.
• La possibilité d'intégrer des tableaux dans vos articles, pages ou widgets texte à l'aide d'un shortcode.
• Édition facile des données du tableau, comme dans Excel.
• Importez et exportez des tableaux aux formats Excel, CSV, JSON et HTML.
• Synchronisation avec Google Sheets.
• Cellules de tableau acceptant les fonctions mathématiques et les formules de calcul.
• Personnalisation graphique via le code CSS.

Comment ajouter un tableau sur WordPress avec le plugin TablePress ?

Une fois TablePress installé et activé, vous verrez un nouvel onglet avec le nom du plugin dans le menu d'administration de WordPress.

Pour ajouter un nouveau tableau à votre site WordPress, cliquez simplement sur TablePress > Ajouter un nouveau tableau dans le menu d'administration, ou sur l'onglet « Ajouter un nouveau » en haut de l'interface TablePress.

Pour créer votre tableau, il vous sera demandé de :

• Donnez un nom à votre tableau . Si vous envisagez de présenter de nombreux tableaux sur votre site, pensez à lui donner un nom clair et descriptif.
• Fournissez une brève description (facultatif). Prenez le temps d'ajouter toute information qui pourrait être utile plus tard.
• Spécifiez le nombre de lignes et de colonnes de votre tableau . Bien que le plugin vous permette d'ajouter et de supprimer facilement ces éléments par la suite, je vous recommande de prendre quelques instants pour lister les informations que vous souhaitez présenter dans votre tableau. Ce petit pas d'anticipation vous fera gagner beaucoup de temps par la suite.

Cliquez ensuite sur le bouton bleu « Ajouter un tableau » en bas de la page. Vous serez maintenant redirigé vers l'écran "Modifier le tableau", où vous pourrez modifier votre tableau.

TablePress dispose également de deux fonctionnalités pour importer et exporter un tableau existant (via TablePress > Importer un tableau ou TablePress > Exporter un tableau).
Par exemple, vous pouvez importer un tableau à partir d'un fichier CSV, XLS ou XLSX à partir d'un tableur (ex. Excel). Enfin, vous pouvez également exporter vos tableaux vers d'autres programmes, tels que des feuilles de calcul.

Comment modifier la structure et le contenu d'un tableau ?

Faites défiler la page jusqu'au bloc "Contenu du tableau". Cette section de la page vous permet d'ajouter du contenu, soit par saisie, soit par copier-coller, directement dans les cellules individuelles du tableau.

Avec le glisser-déposer, il est facile de réorganiser vos lignes et vos colonnes.

Comment enrichir vos tableaux TablePress ?

Avec TablePress, vos tableaux peuvent être enrichis d'images, de liens et d'informations encore plus complexes , comme un shortcode, grâce à son éditeur avancé.

Comment ajouter une image à votre tableau TablePress ?

Pour ajouter une image, rien de plus simple. Faites défiler la page jusqu'au bloc "Manipulation de table" et cliquez sur "Insérer une image".

Cliquez ensuite sur la cellule où vous souhaitez que l'image apparaisse. Il ne vous reste plus qu'à télécharger une image ou à choisir une image dans votre Médiathèque, avant de cliquer sur le bouton bleu « Insérer dans le tableau » en bas à droite de la fenêtre.

Comment ajouter un lien vers un tableau ?

TablePress vous permet également d'insérer des liens dans votre tableau. Pour ce faire, faites défiler jusqu'au bloc "Manipulation de table", puis cliquez sur le bouton "Insérer un lien".

Cliquez ensuite sur la cellule du tableau où vous souhaitez que le lien apparaisse. Une fenêtre pop-up apparaîtra, où vous pourrez configurer votre lien en utilisant l'interface standard de WordPress :

Comment ajouter du contenu riche à votre tableau ?

Vous pouvez également insérer du contenu riche dans une cellule de tableau. TablePress offre également la possibilité d'insérer du contenu, depuis un éditeur avancé. En l'utilisant, vous pouvez ajouter du texte, avec ou sans liens, ainsi que des images dans la même cellule.

Pour trouver l'éditeur avancé, descendez jusqu'au bloc « Table Manipulation » et cliquez sur le bouton du même nom.

Cliquez sur la cellule où vous souhaitez placer le contenu enrichi. Une fenêtre contextuelle apparaîtra dans laquelle vous pourrez configurer votre contenu enrichi.

Quelles sont les options supplémentaires pour personnaliser votre table ?

Les options du tableau

Cette case vous permet de définir l'en-tête ou le pied de page de votre tableau, ce qui peut être utile s'il contient beaucoup de données pour améliorer la lisibilité.

Vous avez également la possibilité de choisir des couleurs alternées pour les lignes du tableau , de surligner une ligne au passage de la souris, ou d'afficher le titre ou la description de votre tableau.

Enfin, le champ "Classes CSS supplémentaires" vous permettra d'attribuer une ou plusieurs classes de votre choix si vous souhaitez la personnaliser en CSS.

La bibliothèque JavaScript DataTables

Les options de cette case vous permettent de donner aux visiteurs la possibilité de trier, filtrer et rechercher dynamiquement dans votre tableau ou d'activer une pagination .

Vous pouvez tout désactiver si vous n'en avez pas besoin.

Rejoignez les abonnés WPMarmite

Obtenez les derniers messages WPMarmite (ainsi que des ressources exclusives).

ABONNEZ-VOUS MAINTENANT

Comment éditer vos tableaux ?

TablePress permet d'éditer facilement la structure d'un tableau.

Dans la boîte « Manipulation du tableau », vous trouverez diverses options pour ajouter, supprimer, dupliquer et masquer des lignes et des colonnes . Vous pouvez également combiner des cellules dans une ligne ou une colonne.

Pour modifier votre tableau, cliquez simplement sur la ligne ou la colonne que vous souhaitez modifier.

Sélectionnez ensuite l'effet approprié. Par exemple, nous avons choisi ci-dessous d'insérer une nouvelle colonne entre deux colonnes existantes :

Une fois que vous avez rempli votre tableau, n'oubliez pas de cliquer sur le bouton "Enregistrer les modifications" en haut de la page. Nous vous recommandons de le faire régulièrement, car il n'y a pas de sauvegarde automatique.

Comment modifier une ancienne table ?

Vous pouvez à tout moment modifier le contenu et la structure d'un tableau que vous avez créé.

Pour trouver la liste des tables existantes, sélectionnez TablePress > Toutes les tables dans votre menu WordPress.

Vous pouvez maintenant choisir la table que vous souhaitez modifier.

Comment insérer un tableau dans un article ou une page ?

Maintenant que vous avez créé votre tableau, il ne vous reste plus qu'à l'insérer dans un article ou une page de votre site WordPress.

Pour cela, ouvrez ou créez le document de destination dans lequel vous souhaitez publier votre tableau, dans l'éditeur de contenu WordPress (Gutenberg).

Copiez le shortcode de la table, disponible dans la case « Table Information » :

Pour info, ce shortcode est au format suivant : [table id=<the-ID> /] . Chaque table a son propre identifiant (le chiffre 2, dans l'exemple ci-dessus).

Collez le shortcode dans un bloc « Shortcode » au sein de la publication de votre choix, là où vous le souhaitez dans le contenu :

Voici le résultat sur le site :

Notez que l'affichage peut différer un peu selon le thème que vous utilisez.

En tout cas, félicitations : vous l'avez fait les doigts dans le nez !

Des fonctionnalités supplémentaires pour aller plus loin avec TablePress

Jusqu'à présent, ce tutoriel vous a donné les bases de la création et de la mise à jour de tableaux dans WordPress sans codage. Vous pouvez également y ajouter des fonctionnalités supplémentaires très utiles .

Une fois que vous maîtrisez les bases, ces tutoriels peuvent vous aider à mettre en œuvre certaines des fonctionnalités les plus intéressantes :

• Utilisez des formules dans les cellules, comme dans Excel.
• Personnalisez votre tableau avec CSS, cette FAQ vous donne toutes les réponses dont vous avez besoin pour personnaliser vos tableaux.

Accélérez votre site Web avec WP Rocket

Transformez votre site en fusée avec le plugin de mise en cache le plus puissant reconnu par les experts WordPress.

Essayez WP Rocket

Bonus : extension TablePress

Vous pouvez ajouter encore plus de fonctionnalités à TablePress avec une bibliothèque d'environ 20 extensions gratuites ou premium.

Vous trouverez sur le site du plugin, 20 extensions officielles. Voici quelques-uns des plus utiles :

• Tables responsives (premium) : pour avoir de belles tables, adaptées à tous les devices (desktop, tablette et mobile). On regrette que ce plugin soit payant, il laisse une belle opportunité à un concurrent potentiel…
• Shortcode pour appeler le contenu d'une seule cellule : très utile si vous souhaitez publier certains éléments d'un tableau, comme un score moyen, à différents endroits de votre page.
• Import automatique et programmé des tableaux (premium) : très utile si vous mettez à jour vos tableaux avec une solution externe comme Excel par exemple.

Techniquement, la grande majorité des soi-disant extensions premium de TablePress peuvent en fait être téléchargées et utilisées gratuitement. Cependant, le développeur Tobias Bathge vous encourage à faire un don de n'importe quel montant pour récompenser son travail.

Quelles autres options existe-t-il pour ajouter un tableau à WordPress ?

Bien que TablePress soit le plugin le plus populaire et le mieux noté du répertoire officiel pour créer un tableau sur WordPress, il existe d'autres recours pour concevoir un tableau.

Le bloc Table dans l'éditeur de contenu WordPress

Tout d'abord, l'éditeur de contenu WordPress dispose d'un bloc « Tableau » très pratique pour créer un tableau simplement et rapidement dans votre contenu.

Vous pouvez notamment :

• Ajoutez ou supprimez des lignes ou des colonnes en temps réel.
• Choisissez entre deux styles d'affichage : "par défaut" et "rayures".
• Modifiez la couleur du texte et de l'arrière-plan.
• Attribuez une largeur fixe à vos cellules.
• Définissez la largeur et le style de vos bordures, ainsi que la typographie.

Ce bloc peut être suffisant pour certains tableaux très basiques , où vous souhaitez simplement présenter les données de manière simple.

Ceux d'entre vous qui souhaitent créer des tableaux plus complexes et réorganisables, ou qui disposent de fonctionnalités de type Excel, préféreront TablePress.

Constructeurs de pages

Une autre option pour ajouter un tableau à WordPress consiste à utiliser un constructeur de page.

Un constructeur de page est un outil qui vous permet de créer des mises en page riches et complexes pour votre contenu sans toucher à une seule ligne de code, notamment grâce à l'utilisation de modèles prêts à l'emploi. Le montage se fait souvent en drag and drop et en temps réel.

Le plus célèbre d'entre eux est Elementor, qui accumule plus de 5 millions d'installations actives sur le répertoire officiel. Aussi puissant et flexible soit-il, Elementor ne propose pas de widget (module) pour construire un tableau !

Cependant, vous pouvez utiliser l'un de ses nombreux addons premium pour atteindre vos objectifs, tels que Crocoblock, ElementsKit ou Ultimate Addons.

Et j'ai peut-être même quelque chose d'encore mieux : vous pouvez simplement ajouter une table créée avec… TablePress à Elementor. Il vous suffit d'ajouter son shortcode dans le widget Shortcode proposé par Elementor, tout comme dans l'éditeur de contenu.

C'est tout pour Elementor. Évoquons aussi brièvement le Divi Builder, l'autre poids lourd du secteur.

Par exemple, TablePress propose un plugin tiers premium, TablePress Styler by Divi-Modules, qui vous aidera à personnaliser l'apparence visuelle du tableau depuis l'interface Divi Builder.

Créez votre site Web avec Elementor

Concevez facilement l'apparence de votre site Web WordPress avec le célèbre constructeur de pages.

Essayez Elementor

Autres plugins pour créer un tableau

En dernier recours, si TablePress ne fonctionne pas du tout pour vous, vous trouverez peut-être votre bonheur avec l'un des plugins de tableau pour WordPress ci-dessous :

• Générateur de tableaux WP
• wpDataTables
• Générateur de tableaux de données par Supsystic
• Tableaux ninjas

Notre avis final sur TablePress

Comme vous l'avez probablement déjà compris, je suis un grand fan de TablePress pour plusieurs raisons :

• Ce plugin est une excellente option si vous souhaitez ajouter facilement des tableaux avancés à votre site WordPress, sans codage.
• Grâce à ses fonctionnalités, vous serez capable de créer rapidement des tableaux élégants qui vous aideront à résumer et trier les données dans un format facile à lire.
• Son interface inspirée d'Excel permet d'aller plus loin que les simples tableaux proposés par l'éditeur de contenu WordPress.
• Et surtout, cela vous permet d'éviter de créer des tableaux en HTML et de passer des heures à bricoler avec du code sans succès.

En revanche, on peut noter que la personnalisation de l'affichage de vos tableaux est assez limitée . Pour un résultat poussé et à votre image, il faudra utiliser le CSS.

Enfin, si le plugin est responsive par défaut, vos tableaux ne s'adapteront pas toujours automatiquement aux différentes tailles d'écran. Parfois, l'affichage peut être coupé, par exemple dans le coin droit.

Encore une fois, ajouter un peu de CSS est parfois recommandé. Vous pouvez également utiliser l'extension Responsive Tables, mentionnée ci-dessus, pour résoudre ce problème.

Téléchargez TablePress sur le répertoire officiel :

Et vous, utilisez-vous TablePress ? Que pensez-vous de ce plugin phare de l'univers WordPress ?