Meer responsieve WordPress-tabellen met herhaalde koppen

WordPress-tabellen zijn een tweesnijdend zwaard, ondanks de vooruitgang die WordPress de afgelopen jaren heeft geboekt. Ze zijn de perfecte kandidaten om gegevens te presenteren, maar ongunstig om een verhaal te vertellen. Als je denkt dat dat nog niet erg genoeg is, wacht dan tot je hoort over smartphones en tablets: apparaten waar je nog minder ruimte hebt om gegevens weer te geven. Er zijn enkele nadelen van tabellen waar je mee moet leren leven, maar responsiviteit is er niet één van.

De laatste grote update voor WP Table Manager introduceerde een nieuw responsief ontwerp voor tabellen met extra responsieve opties. Nu is er een nieuwere en betere versie van de WordPress-tabelbeheerder die een nieuwe responsieve modus en nieuwe opties toevoegt om responsieve tabellen en hun gedrag aan te passen: herhaalde headers.

Responsieve tabellen met herhaalde headers

Wat gebeurt er als er niet genoeg ruimte is om een tabel weer te geven? In de vorige update heeft WP Table Manager u twee responsieve opties gegeven: een schuifbalk toevoegen en kolommen verbergen. Deze twee modi hebben hun toepassingen, maar als u horizontaal scrollen of het verbergen van gegevens wilt vermijden, is de nieuwe derde modus misschien wat u zoekt: herhaalde headers.

De responsieve modus met herhaalde headers werkt, net als alle andere modi, standaard als een normale tabel wanneer er voldoende ruimte is, zoals op een desktopapparaat zoals computers of laptops. Wanneer er niet genoeg ruimte is, wordt het een eenvoudigere tabel met twee kolommen: de tabelkop en de rijwaarde.

In de praktijk betekent dit dat als je vier kolommen in een tabel hebt, elke rij in de oorspronkelijke tabel wordt weergegeven als vier nieuwe rijen in de responsieve versie. Elke nieuwe rij heeft alleen de oorspronkelijke header en de bijbehorende gegevenswaarde. Dit schema is van toepassing op elke rij in de oorspronkelijke tabel, dus er is altijd een herhaalde header naast de gegevenswaarden.

Dankzij dit eenvoudige responsieve gedrag kunt u met de herhaalde koppen tabelmodus zoveel gegevens toevoegen als u wilt aan uw tabellen zonder ooit te hoeven nadenken over hoe het eruit zal zien op mobiele apparaten en tablets. Bovendien gebruikt WP Table Manager afwisselende kleuren voor rijen op kleinere apparaten: elke rij in de oorspronkelijke tabel krijgt een andere kleur, waardoor de context behouden blijft en uw WordPress-lezers onderscheid kunnen maken tussen records.

Responsieve tabellen aanpassen in de modus met herhaalde headers

U kunt de modus met herhaalde headers kiezen bij het bewerken van een tabel: kies responsieve opties uit het opmaak menu en zoek vervolgens naar de herhaalde header modus in de eerste vervolgkeuzelijst. U kunt ook de tabel met herhaalde headers op twee manieren aanpassen: het responsieve breekpunt en de maximale responsieve hoogte.

Het responsieve breekpunt is de breedte waaronder de WordPress-tabelbeheerplugin stopt met het weergeven van de tabel zoals gewoonlijk, en in plaats daarvan overschakelt naar de responsieve modus met herhaalde headers. U kunt deze waarde schatten op basis van uw WordPress-thema en op basis van het aantal kolommen dat u heeft: als u denkt dat de tabel niet onder een bepaalde breedte past, gebruik deze dan als het breekpunt.

Als je veel rijen of kolommen hebt, is het mogelijk dat de herhaalde headers-modus een zeer lange pagina creëert. De responsieve maximale hoogte behandelt dit probleem door de hoogte van de herhaalde headers-tabel in responsieve modus te begrenzen. Als de responsieve tabel te lang is, kunnen je WordPress-lezers een schuifbalk gebruiken om meer gegevens te bekijken zoals gewoonlijk.

Er is geen toverstaf voor responsieve tabellen, maar de herhaalde headers-modus voor WordPress-tabellen komt dichtbij. Of u nu een kleine tabel of een grote tabel met veel rijen en kolommen heeft, de nieuwe herhaalde headers-modus van WP Table Managerzorgt ervoor dat uw gegevens altijd passen, ongeacht het apparaat.