Blocksy

Einleitung

Blocksy ist inzwischen eines der Themes, die mir in Projekten am häufigsten begegnen, wenn ich neue WordPress-Setups aufsetze oder bestehende Seiten technisch entschlacke. Entwickelt wird es von Creative Themes, einem Team, das sich von Anfang an auf ein Ziel konzentriert hat: ein modernes, block-editor-natives Theme zu bauen, das ohne aufgeblähten Page Builder auskommt und trotzdem genug Gestaltungsspielraum bietet.

Im Alltag setze ich Blocksy vor allem dort ein, wo Performance, saubere Struktur und langfristige Wartbarkeit wichtiger sind als kurzfristige Design-Spielereien. Für viele meiner Kundenprojekte, insbesondere Business-Websites, Blogs und kleinere WooCommerce-Shops, ist die kostenlose Version bereits ein solider Startpunkt. Erst wenn es um komplexere Header-Logiken, bedingte Inhalte oder tiefere WooCommerce-Anpassungen geht, kommt Blocksy Pro ins Spiel.

In diesem Beitrag zeige ich dir, was das Theme kann, wo die Grenze zwischen Free und Pro liegt und wie ich Blocksy typischerweise in meinen Tech-Stack aus Blocksy, Fluent Forms Pro, FlyingPress und Perfmatters einbette.

Funktionen & Versionen: Kostenlos vs. kostenpflichtig (Pro)

Blocksy folgt einem klaren Freemium-Modell. Die kostenlose Version ist über das offizielle WordPress-Verzeichnis erhältlich und dort mit sehr guten Bewertungen und einer hohen Zahl aktiver Installationen vertreten. Das ist kein Zufall: Schon im Free-Umfang bekommst du ein solides Fundament.

Das leistet die kostenlose Version bereits:

• Vollständige Kompatibilität mit dem Block-Editor (Gutenberg) und den gängigen Page Buildern
• Header- und Footer-Builder mit Drag-and-drop, allerdings mit einer begrenzten Auswahl an Elementen
• Grundlegende WooCommerce-Unterstützung für einfache Shop-Setups
• Dark-Mode-Umschaltung über den Customizer
• Eine überschaubare Auswahl an Starter Sites zum schnellen Einstieg
• Grundlegende Typografie- und Farboptionen über CSS-Variablen, inklusive Systemschriften (datenschutzfreundlich, da ohne externen Server-Request)

Das kommt mit Blocksy Pro dazu:

• Erweiterter Header- und Footer-Builder mit deutlich mehr Elementen und feinerer Kontrolle
• Content Blocks (Hooks): eigene Abschnitte, die sich bedingt an beliebigen Stellen der Seite einblenden lassen, etwa nur auf bestimmten Beitragsarten oder für definierte Nutzergruppen
• Erweiterte Bedingungslogik für Header, Footer und einzelne Layout-Bereiche
• Zusätzliche, tiefere WooCommerce-Funktionen für Produktseiten, Checkout und Shop-Layouts
• Erweitertes Mega-Menü und flexiblere Menüführung
• Lokale Google Fonts: Über die Pro-Extension lassen sich Google Fonts direkt vom eigenen Server ausliefern statt remote von Google, das ist relevant für DSGVO-Konformität und reduziert externe Requests
• White-Label-Optionen, die sich vor allem für Agentur-Setups eignen
• Deutlich größere Auswahl an Premium Starter Sites

Für mich ist die Trennlinie in der Praxis meist eindeutig: Wer eine schlanke Unternehmensseite oder einen einfachen Blog betreibt, kommt mit der kostenlosen Version oft sehr weit. Sobald jedoch bedingte Inhalte, ein differenziertes WooCommerce-Setup oder ein Agentur-Workflow mit White-Label-Anforderungen dazukommen, lohnt sich der Umstieg auf Pro spürbar. Die aktuellen Tarifmodelle für Blocksy Pro, inklusive Jahres- und Lifetime-Optionen, findest du direkt auf der Website von Creative Themes.

Die wichtigsten Features im Praxistest

Header- und Footer-Builder

Der Baustein-Ansatz von Blocksy ist einer der Gründe, warum ich das Theme immer wieder einsetze. Header und Footer bestehen aus einzelnen Elementen, die sich per Drag-and-drop anordnen lassen, inklusive separater Konfiguration für Desktop und Mobile. In der freien Version stehen dir bereits mehrere Standardelemente wie Logo, Navigation, Suche und Social Icons zur Verfügung. Pro erweitert diese Palette um zusätzliche Elemente und erlaubt eine feinere Steuerung, etwa unterschiedliche Header je nach Seitentyp oder Nutzerlogik.

[SCREENSHOT: Blocksy-Customizer, Header-Builder mit aktivierten Elementen (Logo, Navigation, Suche) in Drag-and-drop-Anordnung, Desktop- und Mobile-Ansicht im Vergleich]

Content Blocks (Hooks)

Content Blocks sind für mich das stärkste Pro-Feature. Damit lassen sich individuelle Abschnitte definieren, die sich über Hooks an bestimmten Stellen im Theme einklinken, etwa vor dem Footer, nach dem Beitragstitel oder innerhalb von Produktseiten. In Kombination mit Bedingungslogik entstehen so dynamische Bereiche, für die man sonst zusätzliche Code-Snippets oder Plugins wie Fluent Snippets bräuchte.

[SCREENSHOT: WordPress-Dashboard → Blocksy → Content Blocks, angelegter Hook mit aktiver Bedingung, z. B. „nur auf Produktseiten“]

Dark Mode & Farbsystem

Der Farbwechsel zwischen hellem und dunklem Modus ist bereits in der kostenlosen Version enthalten und basiert auf CSS-Variablen. Das ist technisch sauber gelöst und wirkt sich kaum auf die Ladezeit aus, weil kein zusätzliches JavaScript-Framework nötig ist. Für Projekte, bei denen Nutzer selbst zwischen den Modi wechseln sollen, ist das ein echter Pluspunkt gegenüber vielen anderen Themes.

Schriften & Datenschutz

In der kostenlosen Version lädt Blocksy Google Fonts standardmäßig remote von den Servern Googles, sofern du keine Systemschriften wählst. Das ist in der Praxis der Punkt, an dem ich bei Kundenprojekten oft nachjustiere, weil ein reiner Verweis auf Google-Fonts-Server ohne Einwilligung datenschutzrechtlich heikel sein kann. Mit der Pro-Extension „Local Google Fonts“ lässt sich das sauber lösen: Über Blocksy → Extensions → Pro Extensions aktivierst du die Funktion, wählst die benötigten Schriftschnitte aus und Blocksy lädt die Dateien einmalig herunter und hostet sie lokal auf deinem Server. Das verbessert nicht nur die Ladezeit, weil externe Requests entfallen, sondern schließt auch die typische Google-Fonts-Abmahnproblematik von vornherein aus. Für Projekte, bei denen ich zusätzlich Wert auf minimale Drittanbieter-Verbindungen lege, kombiniere ich das gern mit Embed Privacy für eingebettete externe Medien.

[SCREENSHOT: WordPress-Dashboard → Blocksy → Extensions → Pro Extensions, aktivierte Local-Google-Fonts-Funktion mit ausgewählten Schriftschnitten]

WooCommerce-Integration

Die Grundintegration mit WooCommerce funktioniert bereits kostenlos zuverlässig: Produktlisten, Warenkorb-Icon im Header, responsive Darstellung. Bei Pro kommen erweiterte Layoutoptionen für Produktseiten, zusätzliche Filter- und Sortiermöglichkeiten sowie tiefere Anpassungen am Checkout dazu. Für kleinere Shops reicht die freie Version oft aus, bei wachsendem Sortiment oder speziellen Anforderungen an die Produktdarstellung würde ich zu Pro raten.

[SCREENSHOT: WooCommerce-Produktseite mit aktivierten Blocksy-Layoutoptionen für Produktbild, Galerie und Kaufbutton]

Performance & Codequalität

Blocksy ist von Grund auf schlank aufgebaut und lädt nur die Assets, die eine Seite tatsächlich benötigt. In Kombination mit FlyingPress für Caching und Asset-Optimierung sowie Perfmatters zur Bereinigung ungenutzter Skripte lassen sich damit sehr gute Ladezeiten erreichen, ohne dass man an der Gestaltungsfreiheit Abstriche machen muss.

Schritt-für-Schritt: Einrichtung & Integration in den WordPress-Stack

1. Theme installieren: Blocksy kostenlos über das WordPress-Verzeichnis installieren und aktivieren.
2. Blocksy Companion einrichten: Das zugehörige Companion-Plugin installieren, das viele der Zusatzfunktionen wie Header-Elemente, Content Blocks und Starter Sites bereitstellt.
3. Pro-Lizenz aktivieren: Falls gewünscht, das Blocksy-Pro-Plugin hochladen und mit dem Lizenzschlüssel verbinden.
4. Starter Site importieren oder eigenes Layout aufbauen: Für neue Projekte spare ich mir mit einer passenden Starter Site oft einige Stunden Grundaufbau.
5. Header und Footer konfigurieren: Elemente per Drag-and-drop anordnen, mobile Ansicht separat prüfen.
6. Dark Mode, Farbsystem und Schriften festlegen: Farbvariablen im Customizer definieren, idealerweise gemäß Corporate Design. Bei Pro zusätzlich unter Blocksy → Extensions → Pro Extensions die Local-Google-Fonts-Funktion aktivieren, um Schriften DSGVO-konform lokal auszuliefern.
7. Performance-Stack ergänzen: FlyingPress für Caching und Perfmatters für Skript-Management installieren, ungenutzte Core-Funktionen deaktivieren.
8. Datenschutz absichern: Bei eingebetteten Inhalten oder Tracking-nahen Funktionen Real Cookie Banner Pro und Embed Privacy ergänzen.
9. Formulare und CRM anbinden: Für Kontakt- und Projektanfragen Fluent Forms Pro einbinden, bei Bedarf mit Fluent CRM Pro verknüpfen.

[SCREENSHOT: Blocksy-Companion-Dashboard mit Übersicht aktivierter Extensions]

Für wen lohnt sich Blocksy Pro – und für wen nicht?

Blocksy Pro lohnt sich für dich, wenn du regelmäßig Websites mit individuellen Layoutanforderungen umsetzt, bedingte Inhalte brauchst oder als Agentur White-Label-Optionen nutzen möchtest. Auch bei WooCommerce-Projekten mit gewachsenem Funktionsumfang zahlt sich die Investition meist aus, weil sich viele Anforderungen direkt im Theme lösen lassen, statt zusätzliche Plugins zu stapeln.

Für einfache Blogs, kleine Business-Websites oder Portfolio-Seiten reicht die kostenlose Version dagegen häufig völlig aus. Wer nur gelegentlich Websites baut oder ein sehr überschaubares Projekt betreut, muss hier nicht zwingend investieren.

Häufige Fragen zu Blocksy Pro (FAQ)