WordPress
Block Editor

«What you see, is what you get.» Dafür steht WYSIWYG, und das kommt beim Block Editor richtig gut zur Geltung. Keine obskuren Felder-Wüsten im Backend, bei welchen man nicht weiss, wo was reingeschrieben werden muss. Echtes WYSIWYG, sodass man beinahe auf eine Vorschau verzichten kann. Beispiel gefällig?

Was kann der Block Editor?

• Modulare Inhaltserstellung: Jeder Abschnitt ist ein Block, den man individuell konfigurieren kann.
• WYSIWYG-Erlebnis: Was du siehst, ist (fast) was du bekommst. Inhalte im Editor ähneln dem, wie sie auf der Website erscheinen.
• Drag & Drop: Blöcke können bequem verschoben oder gruppiert werden.
• Block-Vorlagen & Muster: Vorgefertigte Layouts beschleunigen die Inhaltserstellung.
• Barrierefreiheit & Semantik: Der Editor erzeugt sauberen, semantischen HTML-Code.
• Erweiterbarkeit durch Plugins: Entwickler:innen können eigene Blöcke erstellen oder bestehende erweitern.
• Teil des WordPress-Kerns: Im Gegensatz zu Page Buildern wie Elementor oder WPBakery ist der Block Editor ein offizieller Bestandteil von WordPress – zukunftssicher und gut integriert.

Mit einem intuitiven Drag-and-Drop-System ermöglicht Gutenberg Benutzern, komplexe Layouts mit Leichtigkeit zu erstellen. Unser Team beherrscht den Block Editor und kann Ihnen helfen, massgeschneiderte Blöcke zu entwickeln, die Ihren spezifischen Anforderungen entsprechen. Egal, ob es um die Integration von Multimedia-Inhalten geht oder um die Erstellung benutzerdefinierter Layouts, mit dem Block Editor setzen wir Ihre Vision in die Realität um.

Ein grosser Vorteil moderner WordPress-Themes ist die Datei theme.json. Sie dient als zentrale Konfigurationsdatei für Farben, Schriften, Abstände und viele weitere Designparameter. Die enthaltenen Werte werden sowohl im Editor als auch auf der Website selbst genutzt. Das sorgt nicht nur für Konsistenz im Erscheinungsbild, sondern auch für eine deutlich bessere Redaktionserfahrung.

In unseren Projekten setzen wir die theme.json gezielt ein, um das Corporate Design unserer Kund:innen direkt im System abzubilden. Dazu gehören definierte Farben und Verläufe, die wir so hinterlegen, dass Redakteur:innen sie bequem im Editor, auswählen können, ohne dass sie selbst Farbcodes eingeben oder Styles nachschlagen müssen.

Auch bei den Schriftgrössen setzen wir auf ein durchdachtes System: Statt fester Pixelwerte definieren wir skalierbare, fluide Typografie, die sich dynamisch an verschiedene Bildschirmgrössen anpasst. Dafür haben wir ein eigenes Tool entwickelt: Fluidity. Damit berechnen wir für jedes Projekt passende Werte, die im theme.json hinterlegt werden – so bleibt die Lesbarkeit auf allen Geräten optimal.

Dasselbe Prinzip gilt für Abstände. Statt fixer Werte wie „50 Pixel Abstand“ verwenden wir responsive, fluide Spacing-Werte. So kann ein Abstandhalter beispielsweise auf kleinen Bildschirmen 20px hoch sein, auf grossen 50px – ohne dass jemand manuell CSS anpassen muss. Das sorgt für ein harmonisches Layout auf allen Geräten und ein besseres Nutzererlebnis.

Ein weiterer Punkt, den wir konsequent umsetzen, ist der Einsatz von lokalen Webfonts. Viele Themes laden Schriften über externe Dienste wie Google Fonts, was aus Datenschutzsicht problematisch ist. Wir speichern die Schriften lokal auf dem Webserver und haben dafür ein eigenes Open-Source-Tool entwickelt: Local Google Fonts. Damit lassen sich Schriften aus dem Google-Katalog herunterladen und DSGVO-konform und performant im eigenen Projekt hosten.

Durch all diese Massnahmen wird die theme.json zu einem zentralen Instrument, mit dem wir individuelle Markenidentität, Performance und redaktionelle Freiheit in Einklang bringen. Sauber strukturiert und zukunftssicher.

Viele Standardblöcke in WordPress bieten sogenannte Varianten oder Stile. Damit kann zum Beispiel ein Button blockweise ein anderes Aussehen erhalten – etwa mit abgerundeten Ecken, Rahmen oder Farbvarianten. Auch Blöcke wie Zitate oder Bilder lassen sich so visuell variieren, ohne dass man manuell CSS schreiben muss.

Zusätzlich lassen sich Block-Varianten definieren, die inhaltlich oder funktional leicht abweichen – etwa ein spezielles Layout für eine FAQ oder ein Call-to-Action-Block mit abweichender Darstellung.

Wir nutzen diese Möglichkeiten gezielt, um Redakteur:innen mehr kreative Freiheiten zu geben, ohne dass sie den Look der Seite ungewollt verändern können. Oft erstellen wir eigene Stile und Varianten, die genau auf die Bedürfnisse des Projekts zugeschnitten sind.