Eigener Block¶

Diese Seite ist noch im Aufbau

Das Gerüst steht, die ausführliche Beschreibung folgt. Die Angaben zu Modul, Blöcken und Einstellungen sind geprüft.

Wozu¶

Blöcke werden metadatenbasiert über block.json registriert. Das Theme findet sie automatisch in den Modulordnern; eine Registrierung in PHP ist nicht nötig.

Ein Block gehört in das Modul, dessen Funktion er ausgibt. Ein Block ohne Modul ist ein Block, der sich nicht abschalten lässt.

Einstellungen¶

Wo der Block liegt¶

includes/theme-options/add-ons/mein-modul/gutenberg/mein-block/
  block.json
  render.php     # bei dynamischen Blöcken
  index.js       # Editor
  editor.css     # nur Editor
  style.css      # Editor und Frontend

Zusätzliche Verzeichnisse meldet der Filter twtheme_gutenberg_block_roots an.

Dynamisch oder statisch¶

Art	Wann	Wie
Dynamisch	der Inhalt hängt von Daten ab	`render.php`
Statisch	das Markup steht beim Speichern fest	`save` in der `index.js`

Die meisten Blöcke des Themes sind dynamisch. Statisch sind nur die Layout-Blöcke und die Tabs.

Verwenden¶

Assets richtig zuordnen¶

Hier entstehen die häufigsten Fehler:

Ziel	Feld
Nur Editor	`editorScript`, `editorStyle`
Editor und Frontend	`style`
Nur Frontend, mit JavaScript	`viewScript`

Verboten ist "script" — das lädt im Editor und im Frontend. Ebenso editor.css unter "style", und gemeinsames CSS doppelt in "style" und "editorStyle".

npm run audit:editor-assets

Entwicklertipps¶

Core-Blöcke erweitern statt neu bauen¶

Oft genügt statt eines neuen Blocks eine Erweiterung:

Mittel	Wofür
`register_block_style`	eine Gestaltungsvariante
`registerBlockVariation`	ein Block mit anderen Voreinstellungen
`register_block_type_args`	zusätzliche Attribute an einem Core-Block

TWtheme nutzt alle drei ausgiebig — siehe Blöcke.

Im Child-Theme¶

Ein Child darf eigene Blöcke registrieren, soll aber keine Parent-Namen überschreiben und ein eigenes Präfix verwenden. twtheme/ bleibt dem Parent vorbehalten.