Team Grid Block

wordpress plugin gvp

★ 1stars

Install

Download source zip No release zip yet

This is the repository archive. It installs, but the folder name will carry the branch suffix and updates will not flow.

Install straight from GitHub with WP-CLI:

wp plugin install https://github.com/exzenter/gvp-cards/archive/refs/heads/main.zip

No built-in updater. New versions won't appear under Dashboard → Updates. Install new releases yourself, or let Git Updater track the repository.

Zwei Gutenberg-Blöcke für eine Team-Übersicht mit aufklappbaren Kontaktkarten und deterministischer Masonry-Spaltenverteilung. Ohne Build-Step.

Das Plugin stellt zwei zusammengehörige Blöcke bereit:

Team Grid (team-grid/team-grid) – Container, der beliebig viele Team-Member-Karten aufnimmt. Konfigurierbare Spaltenzahl je Breakpoint (Desktop / Tablet / Mobil) und Abstand.
Team Member (team-grid/team-member) – einzelne Karte mit Foto oder Farbfläche, Name, Position, Qualifikation und aufklappbaren Kontaktdaten (Telefon, Mobil, E-Mail).

Merkmale:

Deterministische Masonry-Verteilung per Vanilla-JS (kürzeste Spalte zuerst). Keine externen Bibliotheken.
Neuverteilung nur bei Init und echtem Breakpoint-Wechsel – beim Auf-/Zuklappen einer Karte springt nichts.
Progressive Enhancement: Ohne JavaScript erscheinen die Karten als saubere vertikale Liste.
Barrierefrei: echtes <button>, aria-expanded, aria-controls, sichtbarer Fokus-Ring, prefers-reduced-motion.
Kein npm/Webpack/Babel/JSX. Reines Vanilla-JS gegen die WordPress-Core-Pakete.
Editor-Vorschau der Karte via ServerSideRender – identisch zum Frontend-Markup.

Plugin als ZIP unter Plugins → Installieren → Plugin hochladen hochladen.
Aktivieren. Fertig – kein Composer, kein npm install.
Im Block-Editor einen Team Grid-Block einfügen und darin Team Member-Karten anlegen.

Nein. Alle JavaScript-Dateien sind direkt lauffähiges Vanilla-JS.

Ja, in assets/js/frontend.js (Konstanten BREAKPOINT_DESKTOP und BREAKPOINT_TABLET).