Waarom
https://support.yard.nl/agent/yarddigital/yard-digital-agency/tickets/details/300585000066065546

Deze persoon gebruikt de linker kolom qua leesvolgorde als "header" , en dat betekend dat de linkjes rechts niet weten "waar ze bij horen".
WCAG-toegankelijkheid: herhaalde linkteksten in tabelrijen (bv. "DSO", "Vergunningcheck") moeten herleidbaar zijn naar hun rij. Daarvoor moet de eerste cel van elke rij een <th scope="row"> zijn i.p.v. een <td>. Het core/table blok heeft hier geen optie voor.
Wat
Voeg aan core/table een optie "Eerste kolom als rijkop" toe (toggle in de blokinstellingen, standaard uit). Staat deze aan, dan wordt de eerste cel van elke rij in de <tbody> server-side omgezet naar <th scope="row">.
Hoort thuis in src/Hooks — zelfde patroon als de bestaande render_block_core/embed hook + editor-JS zoals default-block-hooks/media-text.js.
Aanpak
- JS — nieuw
src/Hooks/resources/js/default-block-hooks/table.js (importeren in index.js):
blocks.registerBlockType → boolean attribuut rowHeader toevoegen aan core/table.
editor.BlockEdit HOC → InspectorControls toggle "Eerste kolom als rijkop".
- Het attribuut staat in de blok-comment (niet in de opgeslagen HTML) → bestaande tabellen blijven geldig, geen deprecation nodig.
- PHP — in
DefaultHookManager::boot(): add_filter('render_block_core/table', …, 10, 2). Bij rowHeader de eerste <td> per <tbody>-rij omzetten naar <th scope="row">.
- Let op:
WP_HTML_Tag_Processor kan geen tag hernoemen → gebruik DOMDocument. Testen met UTF-8 / / accenten (ë, ï).
⚠️ Keuze voor wie dit oppakt: frontend-CSS (A of B)
Een <th> is standaard vet + gecentreerd. Dat moet gereset worden, en de plugin levert nu géén frontend-CSS.
- A — plugin levert een kleine neutrale reset mee (
.wp-block-table tbody th[scope="row"] → font-weight: inherit; text-align: inherit). Werkt out-of-the-box op elke site, maar de plugin moet dan vóór het eerst frontend-CSS gaan bundelen (nieuwe webpack-entry + enqueue).
- B — plugin blijft markup-only; elk thema regelt de styling zelf.
Voor Zuiderzeeland doet het thema sowieso zijn eigen styling (randen/kleuren) — zie het gekoppelde site-issue.
Site-issue: yardinternet/zuiderzeeland#180
Waarom
https://support.yard.nl/agent/yarddigital/yard-digital-agency/tickets/details/300585000066065546

Deze persoon gebruikt de linker kolom qua leesvolgorde als "header" , en dat betekend dat de linkjes rechts niet weten "waar ze bij horen".
WCAG-toegankelijkheid: herhaalde linkteksten in tabelrijen (bv. "DSO", "Vergunningcheck") moeten herleidbaar zijn naar hun rij. Daarvoor moet de eerste cel van elke rij een
<th scope="row">zijn i.p.v. een<td>. Hetcore/tableblok heeft hier geen optie voor.Wat
Voeg aan
core/tableeen optie "Eerste kolom als rijkop" toe (toggle in de blokinstellingen, standaard uit). Staat deze aan, dan wordt de eerste cel van elke rij in de<tbody>server-side omgezet naar<th scope="row">.Hoort thuis in
src/Hooks— zelfde patroon als de bestaanderender_block_core/embedhook + editor-JS zoalsdefault-block-hooks/media-text.js.Aanpak
src/Hooks/resources/js/default-block-hooks/table.js(importeren inindex.js):blocks.registerBlockType→ boolean attribuutrowHeadertoevoegen aancore/table.editor.BlockEditHOC →InspectorControlstoggle "Eerste kolom als rijkop".DefaultHookManager::boot():add_filter('render_block_core/table', …, 10, 2). BijrowHeaderde eerste<td>per<tbody>-rij omzetten naar<th scope="row">.WP_HTML_Tag_Processorkan geen tag hernoemen → gebruikDOMDocument. Testen met UTF-8 / / accenten (ë, ï).Een
<th>is standaard vet + gecentreerd. Dat moet gereset worden, en de plugin levert nu géén frontend-CSS..wp-block-table tbody th[scope="row"]→font-weight: inherit; text-align: inherit). Werkt out-of-the-box op elke site, maar de plugin moet dan vóór het eerst frontend-CSS gaan bundelen (nieuwe webpack-entry + enqueue).Voor Zuiderzeeland doet het thema sowieso zijn eigen styling (randen/kleuren) — zie het gekoppelde site-issue.
Site-issue: yardinternet/zuiderzeeland#180