Mit WordPress 5.9 wird die Ausrichtung der Buttons innerhalb des Buttons-Blocks nicht mehr als Klasse angegeben, sondern als CSS dynamisch generiert. Dieses generierte CSS wird dann innerhalb eines <style>-Tags auf die Seite geschrieben und der jeweilige Button erhält eine einzigartige Klasse im Format wp-container-<id>.

Damit ist es für individuelles Styling praktisch nicht mehr möglich, eine Formatierung anhand der Button-Ausrichtung vorzunehmen, weil der Indikator dafür fehlt.

In meinem Fall ist das beispielsweise problematisch, weil ich dafür sorgen muss, dass mehrere hundert Websites mit ihrem aktuellen individuellen CSS auch nach einem Upgrade auf WordPress 5.9 noch genau so aussehen wie bisher. Und da ist das Entfernen von Klassen natürlich sehr problematisch.

Daher habe ich etwas herumgesucht und musste feststellen, dass man an die entsprechende Ausrichtungs-Klasse gar nicht mehr so einfach kommt, um sie wieder hinzuzufügen. Geschafft habe ich es glücklicherweise dennoch mit folgender Lösung:

/** * Add justification class name to buttons after WordPress 5.9. * * @param string $block_content Block content * @param array $block Block data * @return string Updated block content */ function my_buttons_add_justification( $block_content, $block ) { $block_type = WP_Block_Type_Registry::get_instance()->get_registered( $block['blockName'] ); $default_block_layout = _wp_array_get( $block_type->supports, [ '__experimentalLayout', 'default' ], [] ); $used_layout = isset( $block['attrs']['layout'] ) ? $block['attrs']['layout'] : $default_block_layout; if ( ! empty( $used_layout['justifyContent'] ) ) { $block_content = str_replace( 'class="wp-block-buttons', 'class="wp-block-buttons is-content-justification-' . $used_layout['justifyContent'], $block_content ); } return $block_content; } add_filter( 'render_block_core/buttons', 'my_buttons_add_justification', 10, 2 );
Code-Sprache: PHP (php)

Blöcke haben mittlerweile ein Layout gespeichert (sofern sie Layout-Einstellungen unterstützen). Dieses Layout hole ich mir in den Zeilen 9–11 auf dieselbe Weise, wie das auch der WordPress Core tut.

Ist hier dann eine Ausrichtung gespeichert, füge ich diese als Klasse wieder hinzu. Das mache ich für alle Blöcke vom Typ core/buttons über den entsprechenden Filter.

Damit reiht sich diese Funktion in die Kategorie „zurückbringen, was der Block-Editor mal hatte und wieder verlor“ ein. Für mich hieß WordPress bisher vor allem immer eines: Stabilität. So schön ich den Block-Editor finde und ihn auch gerne verwende, so viel Arbeit macht er mir auch, da hier sehr viele Dinge hinzukommen und irgendwann wieder verschwinden, aber nicht einmal sauber dokumentiert werden, sodass man davon nicht erst im Live-Betrieb davon mitbekommt (und ja, es gibt ein Testsystem, aber auch das kann nicht alle Fälle immer direkt aufzeigen).

3 Kommentare

  1. ich arbeite bei dem filter zwar auch gerne mit str_replace aber frage mich wie nachhaltig das ist. Vor allen Dingen wenn es komplexere Blöcke sind. Mit jeder wp version ändern sich klassen und tagnames bei Gutenberg was tierisch nervt. bin nun erstmal auf loadHTML / DomXPath umgestiegen um Element-Klassen zu ändern. Merke erstmal noch keine Speed-Unterschiede. Aber ich hoffe, das funktioniert sicherer und zuverlässiger.

  2. Danke – endlich jemand, der das auch so sieht.

    Aber dein Codeschnipsel zeigt bei meiner Testseite leider keine Wirkung. Der gehört doch in die functions.php, oder wo fügst du den ein?

Schreibe einen Kommentar zu Marie Antworten abbrechen

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert