Tabellen zijn een belangrijk onderdeel van de meeste websites. Je kunt ze gebruiken om allerlei informatie te delen, van prijzen tot lijsten met features en links. WordPress stelt je in staat om basic tabellen voor je website in te stellen, maar misschien ben je op zoek naar meer aanpassingsopties.

Met Elementor krijg je toegang tot meerdere tabelwidgets. Bovendien zijn er tal van Elementor tabelplugins die nieuwe widgets toevoegen aan deze populaire paginabuilder.

In dit artikel zullen we het hebben over hoe WordPress tabellen werken en hoe ze zich verhouden tot Elementor widgets. Vervolgens laten we je zien hoe je Elementor tabellen handmatig kunt maken en laten we je kennismaken met enkele plugins die nieuwe tabelwidgets aan de editor toevoegen. Laten we beginnen!

Wanneer WordPress tabellen gebruiken

Zodra je ernaar gaat zoeken, zul je merken dat tabellen overal op internet te vinden zijn. Dat komt omdat het enkele van de meest veelzijdige elementen zijn die je op een website kunt gebruiken.

Neem bijvoorbeeld prijstabellen. Het is moeilijk om een dienst- of abonnementswebsite te vinden die geen tabellen gebruikt om je te helpen bij het vergelijken van opties:

Prijstabellen van Kinsta
Prijstabellen van Kinsta

Met tabellen kun je grote hoeveelheden informatie presenteren op een manier die lezers makkelijk kunnen verteren. Nog beter, tabellen maken het voor gebruikers eenvoudiger om meerdere datasets met elkaar te vergelijken:

Meerdere datasets vergelijken
Meerdere datasets vergelijken

Naast het helpen bij het delen van informatie, kunnen tabellen ook helpen de eentonigheid van lange alinea’s in een blogpost of een pagina te doorbreken. Meestal raden we je aan lange lappen tekst te vermijden, omdat deze moeilijk te navigeren kunnen zijn.

De Block Editor geeft je de mogelijkheid om eenvoudig tabellen aan je website toe te voegen. Met het Tabel blok kun je het aantal rijen en kolommen instellen dat je nodig hebt:

Tabellen voor WordPress blokeditor
Tabellen voor WordPress blokeditor

Hoewel het toevoegen van tabellen in WordPress eenvoudig is, ben je enigszins beperkt in aanpassingsopties. Je kunt achtergrondkleuren wijzigen, knopstijlen aanpassen en lettergroottes wijzigen, maar dat is het zo ongeveer. Als je stijlvollere en complexere tabellen wilt maken, moet je een paginabuilder zoals Elementor (of zelfs Divi) gebruiken.

Wat een Elementor tabel kan doen

Als je verder wilt gaan dan standaard WordPress tabellen, geeft Elementor je toegang tot een zeer aanpasbare prijstabel widget. Hiermee kun je tabeltitels bewerken, koptags instellen, lijsten met features toevoegen, Calls To Action (CTA’s) aanpassen en meer:

Elementor prijstabel widget
Elementor prijstabel widget

Onthoud dat je met Elementor elk type lay-out kunt maken dat je wilt voor elke pagina of elk bericht. Dit betekent dat je ontwerpen met meerdere kolommen kunt instellen, zodat je meerdere prijstabel widgets naast elkaar kunt hebben:

Prijstabel widgets in Elementor naast elkaar
Prijstabel widgets in Elementor naast elkaar

Elementor wordt ook geleverd met een Inhoudsopgave widget. Dit maakt het navigeren door long-form content veel makkelijker voor je lezers.

Zo maak je een Elementor tabel (handmatig)

Het maken van een prijstabel met Elementor is eenvoudig. Open de Elementor editor om aan de slag te gaan. Vanaf hier kun je ervoor kiezen om met een lege pagina te beginnen of om een template uit de Elementor bibliotheek te importeren:

Kies een pagina of template uit de Elementor bibliotheek
Kies een pagina of template uit de Elementor bibliotheek

Wanneer je klaar bent om het element toe te voegen, moet je het aantal kolommen selecteren dat je in de tabel wilt hebben. Klik op het Elementor plusteken onderaan de editor en selecteer de kolomstructuur die je wilt gebruiken voor het prijsgedeelte:

Selecteer het gewenste aantal kolommen
Selecteer het gewenste aantal kolommen

Houd er rekening mee dat als je meerdere kolommen gebruikt, je in elk ervan een afzonderlijke Price List widget moet toevoegen. Hoewel elke tafel een uniek element zal zijn, zien gebruikers ze naast elkaar (of onder elkaar op mobiel) als onderdeel van één sectie:

Voeg indien nodig meerdere tabelwidgets toe
Voeg indien nodig meerdere tabelwidgets toe

We raden aan om één prijstabelmodule toe te voegen en deze eerst te stylen. Vervolgens kun je dat element dupliceren of kopiëren naar de resterende kolommen en aan elke kolom unieke tekst toevoegen.

Om de tabel aan te passen, selecteer je het element en ga je naar het Style tabblad onder de widgetinstellingen. Elementor biedt je tal van stylingmogelijkheden. Hieronder vallen kleurselectie, typografie instellingen en unieke configuraties voor elk gedeelte van de tabel:

Pas de tabel aan met behulp van de stijlopties in Elementor
Pas de tabel aan met behulp van de stijlopties in Elementor

Als je tevreden bent met de stijl van de prijstabel, klik je met de rechtermuisknop op het element en selecteer je de optie Duplicate. Een kopie van de tabel verschijnt onder het originele element en je kunt deze naar een van de lege kolommen slepen:

Dupliceer je tabel om tijd te besparen
Dupliceer je tabel om tijd te besparen

Je wilt dat proces herhalen voor zoveel kolommen als je hebt. Houd er rekening mee dat elke tabel een unieke stijl kan hebben als je instellingen liever niet opnieuw gebruikt. Zorg er in dat geval voor dat de stijlen voldoende op elkaar lijken, zodat bezoekers begrijpen dat ze naar een vergelijking kijken.

Onthoud bij het aanpassen van je tabel dat je met Elementor aangepaste CSS aan elke module kunt toevoegen. Ga hiervoor naar de Advanced instellingen van de widget en selecteer het Custom CSS  tabblad:

Aangepaste CSS toevoegen
Aangepaste CSS toevoegen

Het toevoegen van aangepaste CSS via Elementor is een stuk eenvoudiger dan het handmatig bewerken van WordPress code. Daarnaast vereist het bewerken van CSS in WordPress dat je toegang krijgt tot themabestanden en de code optimaliseert voor topprestaties. Met Elementor hoef je alleen maar de CSS code toe te voegen in het bijbehorende veld voor elke module.

Als het handmatig toevoegen van CSS intimiderend klinkt, hoef je je geen zorgen te maken. Voor het leren van CSS hoef je geen webontwikkelaar te zijn. Het is echter een waardevolle vaardigheid die je zal helpen je WordPress websites aan te passen (en misschien zelfs een carrière in webontwikkeling te vinden).

Zodra al je tabellen zijn ingesteld, is het tijd om hun tekst te bewerken en voor elk item zoveel features toe te voegen als je nodig hebt. Je kunt dat doen door een tabel te selecteren en naar het Content tabblad onder de widgetinstellingen te gaan:

Tabeltekst en andere tabelcontent bewerken
Tabeltekst en andere tabelcontent bewerken

Het bewerken van de content van je prijstabellen is eenvoudig. Je kunt op elk element in de widget klikken om het te bewerken. Als je eenmaal tevreden bent met de resultaten, zijn je prijstabellen klaar om te gebruiken.

Top Elementor tabelplugins (12 opties)

Hoewel Elementor tal van tools bevat om je te helpen bij het maken van tabellen, kun je altijd meer widgets aan de verzameling toevoegen. In dit gedeelte bekijken we 12 Elementor plugins die je kunt gebruiken om nieuwe soorten tabellen aan je berichten en pagina’s toe te voegen. Hoewel veel van deze add-ons zijn gebouwd voor Elementor, kun je ze als gewone plugins installeren.

Zoals altijd raden we alleen de beste WordPress plugins aan die geweldige prestaties bieden en die regelmatig worden bijgewerkt. Door goed geoptimaliseerde plugins te gebruiken, kun je je website opschalen zonder prestatieproblemen.

1. ElementsKit Add-Ons for Elementor

ElementsKit add on
ElementsKit

ElementsKit voegt meer dan 85 widgets toe aan Elementor. Je hebt opties voor basistabellen, prijstabellen, ondersteuning voor het insluiten van TablePress elementen en meer.

De professionele versie van ElementsKit bevat ook een widget voor geavanceerde tabellen. Hiermee kun je zoek- en filterfeatures toevoegen aan tabellen. Bovendien kun je paginering opnemen, zodat gebruikers door items kunnen navigeren zonder enorme tabellen op je website te hebben.

Belangrijkste features:

  • Drie soorten tabelwidgets
  • Ondersteuning voor tabelfiltering, zoeken en paginering
  • Integratie met TablePress voor het insluiten van tabellen

Prijs: ElementsKit licenties beginnen bij $39 per jaar.

2. WP Table Builder

WP Table Builder plugin for Elementor
WP Table Builder

Als je een fan bent van drag-and-drop editors (wat je zou moeten zijn als je Elementor gebruikt), zul je WP Table Builder graag gebruiken. Met deze plugin kun je tabellen maken met behulp van vooraf geconfigureerde elementen zoals knoppen, beoordelingssecties, productbeoordelingen en meer.

Naast geavanceerde elementen krijg je toegang tot basismodules, zoals tekst en afbeeldingen. De plugin wordt ook geleverd met tabeltemplates, waardoor je werk nog eenvoudiger wordt.

Je kunt WP Table Builder tabellen aan je website toevoegen met behulp van de Block Editor. De plugin integreert ook met Elementor, waardoor het makkelijk is om tabellen overal op je website te plaatsen.

Belangrijkste features:

  • Gebruik een drag-and-drop tabel builder
  • Krijg toegang tot kant-en-klare elementen zoals knoppen, recensiesecties en productbeoordelingen
  • Pas de stijl van elk element in je tabellen aan
  • Gebruik vooraf gemaakte paginatemplates

Prijs: WP Table Builder licenties beginnen bij $39 per jaar.

3. TablePress

TablePress add on
TablePress

TablePress is een gratis plugin voor het toevoegen van spreadsheetfunctionaliteit aan WordPress. De plugin kan gegevens in verschillende formats importeren, waaronder Excel, CSV en JSON bestanden. Je kunt zelfs tabelgegevens voor andere programma’s exporteren.

Met TablePress kun je tabellen maken die zoekfunctionaliteit bevatten. Gebruikers kunnen kiezen hoeveel items ze willen weergeven en van pagina naar pagina gaan als je enorme datasets laat zien.

Het insluiten van TablePress tabellen met Elementor is eenvoudig. De plugin maakt unieke shortcodes voor elke tabel. Met de Elementor Shortcode widget kun je die codes overal op je website toevoegen.

Belangrijkste features:

  • Gegevenssets importeren en exporteren in Excel, CSV, JSON en HTML formats
  • Doorzoekbare tabellen toevoegen aan WordPress
  • Paginering voor tabellen inschakelen

Prijs: TablePress is een gratis plugin, maar je kunt er premium extensies voor vinden.

4. Essential Addons for Elementor

Essential Addons for Elementor
Essential Addons

Essential Addons for Elementor voegt meer dan 80 nieuwe widgets toe aan de paginabuilder. Je hebt opties voor prijstabellen, gegevenstabellen, inhoudsopgaven en meer.

Essential Addons for Elementor komt in twee versies. De gratis plugin voegt een betere versie toe van de prijstabelwidget waarmee Elementor wordt geleverd. Als je toegang wilt tot gegevenstabellen (waaronder filteren, zoeken en meerdere stijlen), moet je betalen voor een premiumlicentie.

Belangrijkste features:

  • Prijs, gegevens en contenttabelwidgets toevoegen
  • Zoeken en filteren in tabellen inschakelen

Prijs: er is een gratis versie van Essential Addons for Elementor en premium licenties beginnen bij $39,97 per jaar.

5. PowerPack for Elementor

PowerPack for Elementor add on
PowerPack for Elementor

PowerPack for Elementor voegt meer dan 70 widgets toe aan de paginabuilder. De plugin bevat ook een groot aantal nieuwe templates waarmee je sneller websites kunt ontwerpen.

Wat tabellen betreft stelt PowerPack je in staat om sorteerbare en doorzoekbare gegevenstabellen op te zetten. Je kunt gegevens in tabellen importeren met behulp van CSV bestanden. De plugin bevat ook meerdere opties voor tabeltemplates.

Naast gegevenstabellen biedt PowerPack ook info en prijstabelwidgets. Infotabellen zijn perfect als je bezoekers een overzicht wilt geven van de diensten die je aanbiedt.

Belangrijkste features:

  • Sorteerbare en doorzoekbare gegevenstabellen maken
  • Gegevenstabellen importeren in CSV format
  • Prijs en infotabelwidgets toevoegen

Prijs: PowerPack licenties beginnen bij $44 per jaar.

6. Exclusive Addons for Elementor

Exclusive Addons for Elementor plugin
Exclusive Addons for Elementor

Exclusive Addons for Elementor is verkrijgbaar in zowel gratis als premium versies. De gratis plugin voegt 39 nieuwe widgets toe aan Elementor, terwijl een premium licentie je meer dan 69 nieuwe elementen oplevert.

Als het op tabellen aankomt, voegt de gratis versie een nieuwe prijstabelmodule. Met de premium versie krijg je toegang tot vergelijkings- en gegevenstabellen. Vergelijkingstabellen werken op dezelfde manier als prijselementen, maar je kunt nieuwe lay-outs en stijlen gebruiken.

Belangrijkste features:

  • Een nieuwe prijstabelmodule toevoegen
  • Krijg toegang tot vergelijkings- en gegevenstabellen
  • Toegang tot meerdere lay-outs voor tabelwidgets

Prijs: er is een gratis versie van Exclusive Addons for Elementor. Premium licenties beginnen bij $29 per jaar.

7. JetElements

JetElements addon
JetElements

JetElements voegt 45 nieuwe widgets toe aan Elementor. De meeste zijn gericht op e-commerce en abonnementswebsites. JetElements heeft echter ook verschillende interessante tabelwidgets in zijn selectie.

Onder die widgets vind je prijzen en responsieve tabellen. Vergeleken met de basisprijstabellen in Elementor, biedt de JetElements versie je veel nieuwe aanpassingsopties. Je kunt bijvoorbeeld spelen met veel visuele effecten zoals parallax en micro-animaties voor tabelelementen.

Belangrijkste features:

  • Voeg prijzen en responsieve tabellen toe aan Elementor
  • Pas tabellen aan met nieuwe visuele effecten, zoals parallax

Prijs: JetElements all-inclusive licenties beginnen bij $130 per jaar. Je kunt ook aangepaste widgetbundels maken, waarbij je alleen de opties kiest die je wilt gebruiken.

8. Premium Addons for Elementor

Premium Addons for Elementor
Premium Addons for Elementor

Premium Addons for Elementor is er in zowel gratis als premium versies. Alleen de premium plugin voegt echter nieuwe tabelwidgets toe aan Elementor.

Als je betaalt voor een premiumlicentie, krijg je toegang tot nieuwe gegevens- en prijstabelwidgets. Je kunt gegevenstabellen begeleiden met diagram- en grafiekwidgets als je meer informatie voor je bezoekers wilt weergeven.

Belangrijkste features:

  • Voeg gegevens- en prijstabelwidgets toe aan Elementor
  • Begeleid tabellen met diagram- en grafiekwidgets

Prijs: Licenties voor Premium Addons for Elementor beginnen bij $39 per jaar.

9. DataMentor

DataMentor addon for Elementor
DataMentor

DataMentor is een plugin die een enkele tabelwidget toevoegt aan Elementor. Die widget bevat echter veel meer features dan de meeste add-ons die we tot nu toe hebben gezien.

DataMentor tabellen zijn ongelooflijk veelzijdig. Je kunt binnen elk element afbeeldingen, knoppen, lijsten en pictogrammen toevoegen. Met de widget kun je tabellen maken met individuele stijlen voor elke kolom of rij. Je krijgt ook toegang tot verschillende tabeltemplates als je het ontwerpproces een kickstart wilt geven.

Belangrijkste features:

  • Voeg een nieuwe tabelwidget toe aan Elementor
  • Krijg toegang tot meerdere tabeltemplates
  • Afbeeldingen, tekst, knoppen, lijsten en pictogrammen toevoegen aan tabellen

Prijs: DataMentor is een gratis plugin.

10. Happy Addons for Elementor

Happy Addons for Elementor
Happy Addons

Happy Addons for Elementor is een van de meest uitgebreide plugins voor de paginabuilder. Deze tool voegt meer dan 99 widgets toe aan Elementor en een brede verzameling nieuwe templates aan de bibliotheek.

Wat tabellen betreft, bevat Happy Addons zowel basis als geavanceerde tabelwidgets. De geavanceerde versie ondersteunt geïmporteerde gegevens in meerdere formats, evenals zoeken, filteren en pagineren. Bovendien krijg je toegang tot meerdere vooraf ontworpen tabellayouts. Naast deze opties bevat Happy Addons ook prijs en vergelijkingstabelelementen.

Belangrijkste features:

  • Toegang tot basic en geavanceerde tabelwidgets
  • Gegevens importeren voor geavanceerde tabellen
  • Gebruik vooraf ontworpen tabellay-outs
  • Prijs en vergelijkingstabellen toevoegen

Prijs: er is een gratis versie van Happy Addons. Premium licenties beginnen bij $39 per jaar.

11. Royal Elementor Addons

Royal Elementor Addons
Royal Elementor Addons

Royal Elementor Addons voegt meer dan 40 nieuwe widgets toe aan Elementor. Deze zijn allemaal gratis, maar de plugin wordt ook geleverd in een premiumversie die extra aanpassingsopties voor elke widget ontgrendelt.

Met Royal Elementor Addons krijg je een nieuwe prijstabel om te gebruiken in Elementor. Deze widget bevat verschillende nieuwe stijlopties. Bovendien wordt het geleverd met een schakeloptie die bezoekers kunnen gebruiken om te schakelen tussen maandelijkse en jaarlijkse prijzen (of andere opties).

Belangrijkste features:

  • Voeg een nieuwe prijstabelwidget toe aan Elementor
  • Pas prijstabellen aan met nieuwe stijlopties
  • Voeg een prijsschakelaar toe aan je tabellen

Prijs: Royal Elementor Addons is gratis. Premium licenties kosten $29 per website (het is een eenmalige vergoeding).

12. Elementor Addon Elements

Elementor addon elements plugin
Elementor Addon Elements

Elementor Addon Elements is een gratis plugin die meer dan 24 nieuwe widgets aan Elementor toevoegt. Onder hen heb je opties voor prijs-, vergelijkings- en gegevenstabellen.

Prijstabellen bevatten veel extra aanpassingsopties die de standaard Elementor widget niet heeft. Als het gaat om gegevenstabellen, kun je kiezen tussen doorzoekbare of filterbare elementen. Bovendien ondersteunen tabellen animaties, waardoor ze een stuk visueel aantrekkelijker kunnen worden.

Belangrijkste features:

  • Prijs-, vergelijkings- en gegevenstabellen toevoegen aan Elementor
  • Kies tussen filterbare en doorzoekbare gegevenstabellen
  • Animaties toevoegen aan gegevenstabellen

Prijs: Elementor Addon Elements is gratis.

Samenvatting

Elementor biedt je een breed scala aan tools om stijlvolle en complexe WordPress tabellen te maken. Veel WordPress tabelplugins zijn daarnaast compatibel met Elementor, wat betekent dat je met de paginabuilder bijna elk type tabel aan je website kunt toevoegen.

De Elementor paginabuilder wordt geleverd met een intuïtieve Price List widget. Als je andere soorten tabellen wilt toevoegen, raden we aan om Elementor tabelplugins te gebruiken, zoals ElementsKit of WP Table Builder.

Kinsta CDN is een high-performance CDN die zonder extra kosten beschikbaar is voor alle Kinsta klanten. Het wordt aangedreven door onze gratis Cloudflare integratie en levert automatisch je content vanuit meer dan 200 PoP’s over de hele wereld. Als je vragen hebt over Kinsta CDN, neem dan gerust contact op met ons 24/7 ondersteuningsteam voor verdere hulp!

Jeremy Holcombe Kinsta

Content & Marketing Editor bij Kinsta, WordPress Web Developer en Content Writer. Buiten alles wat met WordPress te maken heeft, geniet ik van het strand, golf en films. En verder heb ik last van alle problemen waar andere lange mensen ook tegenaan lopen ;).