JetGridBuilder Anleitung: Kostenlose Raster für Beiträge

Die meisten Blog- und Referenzseiten sehen gleich aus: drei Spalten, gleich große Karten, Bild oben, Titel darunter. Das ist ordentlich, aber selten aufregend. Wer seine Arbeiten, Projekte oder Produkte lebendiger zeigen will, braucht ein Raster, in dem Karten unterschiedlich groß sein dürfen.

Genau dafür gibt es JetGridBuilder von Crocoblock. Das Plugin baut frei angeordnete Raster aus Beiträgen, Seiten, Produkten oder Kategorien, in Elementor und im Block-Editor. Und es ist, anders als die meisten Jet-Plugins, kostenlos.

In diesem Beitrag zeige ich Ihnen, was JetGridBuilder kann, wie Sie ein erstes Raster aufsetzen und wann Sie besser beim normalen Beitrags-Widget bleiben.

Die kurze Antwort

JetGridBuilder ist ein kostenloses Plugin für individuelle Raster aus Inhalten: Beiträge, Seiten, eigene Inhaltstypen, WooCommerce-Produkte und Kategorien. Es lohnt sich, wenn Sie ein Portfolio, eine Referenzseite oder einen Magazin-Einstieg mit unterschiedlich großen Kacheln bauen möchten. Für eine schlichte Blogübersicht mit gleichmäßigen Karten brauchen Sie es nicht.

Was JetGridBuilder kann

Laut offizieller Produktseite:

Bereich	Was dahintersteckt
Inhaltstypen	Eigene Inhaltstypen (CPT), Beiträge, Seiten, Produkte, Kategorien und Begriffe
Widgets/Blöcke	Post Grid Builder und Terms Grid Builder, für Elementor und Gutenberg
Raster-Einstellungen	Spaltenanzahl, Abstände (Gutter) und Lückenbreite zwischen den Zellen
Karten	Größe, Position, Reihenfolge und Stil jeder Karte einzeln anpassen
Vertical Compact	Frei platzierte Karten automatisch nach oben ausrichten, damit keine Lücken bleiben
Vorschaubild	Beitragsbild pro Kachel ein- oder ausblenden und Größe festlegen
Responsive	Vorschau für Desktop, Tablet und Handy
Integrationen	ACF, Pods, JetEngine, WooCommerce, Meta Box, Toolset
Preis	Kostenlos

Schritt für Schritt: JetGridBuilder einrichten

Als Beispiel baue ich eine Referenzseite: sechs Projekte, das wichtigste groß, die anderen kleiner darum herum.

1. Plugin herunterladen. Auf der Produktseite klicken Sie auf den Download für die kostenlose Version. Crocoblock schickt den Link per E-Mail, dafür müssen Sie eine Adresse angeben und den Erhalt von Werbe-E-Mails bestätigen. Das sollten Sie wissen, bevor Sie klicken.
2. Installieren und aktivieren. Unter Plugins → Installieren → Plugin hochladen die ZIP-Datei hochladen und aktivieren. Ein Lizenzschlüssel ist für die kostenlose Version nicht nötig.
3. Inhalte vorbereiten. Jedes Projekt braucht einen Titel, ein aussagekräftiges Beitragsbild und am besten einen kurzen Auszug. Ob Sie dafür normale Beiträge mit einer Kategorie „Referenzen“ nehmen oder einen eigenen Inhaltstyp, hängt vom Umfang ab. Für eigene Inhaltstypen ist JetEngine das passende Werkzeug.
4. Widget einfügen. Öffnen Sie die Zielseite in Elementor oder im Block-Editor und ziehen Sie das Widget bzw. den Block Post Grid Builder in einen Abschnitt.
5. Abfrage festlegen. Wählen Sie den Inhaltstyp und grenzen Sie auf die Kategorie „Referenzen“ ein.
6. Raster einstellen. Legen Sie die Spaltenanzahl fest, zum Beispiel vier, und die Abstände zwischen den Karten. Danach ziehen Sie die erste Karte auf doppelte Breite und Höhe. Die anderen ordnen sich darum an.
7. Vertical Compact einschalten. Wenn durch unterschiedliche Größen Lücken entstehen, schiebt diese Option die Karten automatisch nach oben.
8. Karten gestalten. Titel, Auszug und Vorschaubild ein- oder ausblenden, Schrift und Abstände anpassen. Nutzen Sie hier Ihre globalen Farben und Schriften, damit das Raster zum Rest der Seite passt.
9. Mobile Ansicht prüfen. Schalten Sie in die Tablet- und Handy-Ansicht. Auf dem Handy ist eine Spalte meist die beste Wahl, große und kleine Kacheln wirken dort selten gut.

Wenn Sie das Raster zusätzlich filterbar machen möchten, etwa nach Branche, ist JetSmartFilters die passende Ergänzung. Prüfen Sie aber vorab, ob die Filter mit dem Grid-Widget zusammenarbeiten, bevor Sie viel Zeit investieren.

Drei Praxisbeispiele

Die Architektin mit Referenzen. Ein Büro in Salzburg zeigt sein Leuchtturmprojekt groß, darum herum kleinere Arbeiten. Das Raster wirkt wie eine gestaltete Mappe statt einer Liste.

Das Stadtmagazin. Ein Verein, der ein Online-Magazin für die Region betreibt, setzt den Aufmacher groß und die übrigen Artikel kleiner daneben. Neue Beiträge rutschen automatisch nach.

Der Shop mit Kategorie-Einstieg. Ein Weinhändler zeigt seine Kategorien (Rot, Weiß, Schaumwein, Geschenke) als unterschiedlich große Kacheln mit Bild. Dafür ist der Terms Grid Builder gedacht.

Typische Fehler und wie Sie sie vermeiden

Bilder in falschem Format. Wenn große Kacheln mit kleinen Vorschaubildern gefüllt werden, wirken sie unscharf. Laden Sie Beitragsbilder groß genug hoch und komprimieren Sie sie trotzdem.

Zu verspielt. Ein Raster, in dem jede Karte eine andere Größe hat, wirkt schnell chaotisch. Zwei Größen reichen meistens.

Die Handy-Ansicht vergessen. Was am Desktop elegant aussieht, kann auf dem Handy zu winzigen Kacheln führen. Testen Sie jede Ansicht.

Ein zusätzliches Plugin für einen Standardfall. Wenn alle Karten gleich groß sein sollen, reicht das Beitrags-Widget Ihres Builders. Jedes Plugin mehr ist ein Update mehr und etwas mehr Code. Mehr dazu: Elementor Performance optimieren.

Caching nach Änderungen. Wenn neue Beiträge nicht im Raster erscheinen, liegt es fast immer am Seiten-Cache. Zuerst Cache leeren, dann Fehler suchen.

Lohnt sich JetGridBuilder? Kosten und Alternativen

JetGridBuilder ist kostenlos. Auf der Preisseite führt Crocoblock es zusammen mit JetStyleManager unter den kostenlosen Jet-Plugins. Der einzige Preis ist die E-Mail-Adresse für den Download-Link.

Meine ehrliche Einschätzung: Für ein gestaltetes Portfolio oder einen Magazin-Einstieg ist JetGridBuilder eine gute, kostenlose Wahl. Für eine normale Blogübersicht brauchen Sie es nicht. Elementor bringt dafür eigene Widgets mit, und der Block-Editor hat den Abfrage-Loop-Block.

Spannend wird es, wenn Sie ohnehin mit JetEngine arbeiten. Dann lassen sich laut Produktseite zusätzliche Eigenschaften dynamisch auf den Karten ausgeben. Wer mehrere Jet-Plugins braucht, fährt oft mit dem All-Inclusive-Paket günstiger als mit Einzellizenzen. Welche Plugins für welches Projekt sinnvoll sind, steht in meinem Crocoblock-Überblick, die Pakete finden Sie auf der Crocoblock-Preisseite.

Häufige Fragen

Ist JetGridBuilder wirklich kostenlos?

Ja. Die Produktseite bezeichnet es als vollständig kostenlos. Für den Download müssen Sie eine E-Mail-Adresse angeben.

Funktioniert JetGridBuilder ohne Elementor?

Ja. Es gibt die Raster-Widgets laut Produktseite für Elementor und für den Block-Editor (Gutenberg).

Kann ich WooCommerce-Produkte im Raster zeigen?

Ja. Produkte sind ausdrücklich als Inhaltstyp genannt, WooCommerce steht in der Liste der Integrationen.

Was ist der Unterschied zwischen Post Grid und Terms Grid?

Der Post Grid Builder zeigt einzelne Inhalte, also Beiträge, Seiten oder Produkte. Der Terms Grid Builder zeigt Kategorien oder Schlagwörter, etwa als Einstieg in einen Shop.

Wenn Sie ein Raster wie dieses lieber gemeinsam aufbauen: In meiner Elementor-Schulung richte ich es mit Ihnen an Ihrer eigenen Website ein, remote, € 109,– pro Stunde. Wer mit dem Block-Editor arbeitet, ist in der WordPress-Schulung richtig.