Ein neuer Seitenersteller ist gerade im WordPress-Bereich gelandet, und es sieht nicht wie die anderen aus Mosaic Builder verfolgt einen klassenbasierten Design-System-Ansatz, um WordPress-Sites zu erstellen, näher an Webflow als an Elementor. Wir haben Zeit damit verbracht, dem offiziellen Start-Walkhrough gefolgt und eine Website von Grund auf neu erstellt, um zu sehen, was sie tatsächlich gut macht.
Deshalb hier unser vollständiger Mosaic Builder-Test: Was es ist, wie sich der Editor fühlt und ob Sie ihm noch ein echtes Projekt anvertrauen sollten.
Kurzer Hinweis, bevor wir beginnen: wir bauen Master-Addons für Elementor„Wir leben also jeden Tag im Elementor-Ökosystem. Das gibt uns eine nützliche Linse für die Beurteilung eines neuen Erbauers, und wir werden überall darauf hinweisen, wo unsere Perspektive das Urteil einfärbt.
Was ist Mosaikbauer?
Mosaik Ist ein WordPress-Page-Builder und Theme-Builder in einem eingerollt Seine Tonhöhe ist einfach: “Müde von Design-Grenzen in WordPress? Mosaik treffen”
Anstatt Widgets auf eine Leinwand zu werfen und jedes einzelne einzeln zu stylen, basiert Mosaik auf einem Designsystem. Sie erhalten:
- A Klassensystem Mit Elementklassen und Utility-Klassen, ähnlich wie Entwickler CSS schreiben
- Stilführer Das steuert Farben und Typografie auf der gesamten Website
- KomponentenWiederverwendbare Elemente, die Sie einmal bearbeiten und überall aktualisieren
- Meister und Vorlagen Die Layouts auf Theme-Ebene verarbeiten (Header, Footer, Archive, einzelne Beiträge)
- Ein Interaktionsbauer Zum Scrollen, Bewegen und Klicken auf Animationen
- A Schleifenbauer Für dynamische Inhalte wie Blogarchive und benutzerdefinierte Posttypen
Es wird mit drei Starter-Themen ausgeliefert: Gibraltar (fett, modern), Monolith (sauber, minimalistisch), und Blank für den Bau ab Null Wenn Sie Webflow oder Bricks Builder verwendet haben, wird sich dieses Modell vertraut anfühlen Wenn Sie direkt von Elementor kommen, erwarten Sie eine mentale Verschiebung.
Erste Schritte: Der Setup-Assistent
Das Onboarding von Mosaic ist besser als die meisten Plugins, die wir getestet haben Nach der Aktivierung führt Sie ein vierstufiger Assistent durch Einstellungen, Master, Vorlagen und Seiten.
Der clevere Teil ist das Skinning-System Wählen Sie ein Thema wie Monolith, dann wählen Sie eine Farbhaut (Cyan, Violet, Rose, Teal, und sechs andere) und eine Schriftarthaut (Neutral, Elegant, Timeless, Geometric, Modern, Futuristic).Die gesamte Demoseite wird sofort neu gestaltet, einschließlich eines hellen oder dunklen Farbmodus-Kippschalters.
Das funktioniert, weil alles im Theme auf Stilvariablen statt auf fest codierte Werte verweist Ändern Sie einmal die Markenfarbe und jeder Button, Link und jedes Icon folgt Elementor hat Global Colors, die etwas Ähnliches tun, aber die Implementierung von Mosaic geht tiefer, da die Starter-Themes vom ersten Tag an komplett auf dem variablen System aufgebaut sind.
Innerhalb weniger Minuten hatten wir eine vollständige Demoseite installiert: Homepage, Blogarchiv, Blogbeitrag, Kontaktseite mit Karte, 404 Seiten und Suchergebnisse, alle bearbeitbar.
Der Herausgeber: Eine strukturell erste Leinwand
Öffnen Sie eine Seite in Mosaik und das Layout ist erkennbar: Elementbaum links, Live-Canvas in der Mitte, Stilsteuerung rechts Aber die Philosophie unterscheidet sich von der von Elementor.
Der Navigator von Mosaic zeigt Ihre Seite als verschachtelte Struktur an: Abschnitt, Container, Zeilen, dann Elemente wie Überschriften, Absätze, Schaltflächen, Symbolfelder und Divs. Sie wählen Elemente aus dem Baum so oft aus wie aus der Leinwand. Das rechte Feld legt echte CSS-Konzepte offen: Breite mit Min/Max-Werten, Position mit Z-Index, Flex-Steuerelemente, Transformationen (übersetzen, skalieren, drehen), Box-Schatten und Überlauf.
Für Entwickler ist das erfrischend Die Steuerung bildet eins zu eins mit dem CSS ab, das man von Hand schreiben würde, so dass sich nichts versteckt oder umbenannt anfühlt Für Anfänger ist es ein steilerer Hügel Elementor lässt einen eine Überschrift stylen, ohne zu wissen, was ein Flexcontainer ist Mosaik nimmt leise an, dass man es tut.
Eines haben wir geschätzt: Der Editor blieb während unseres Test-Builds reaktionsschnell, selbst wenn die vollständige Monolith-Demo geladen war.
Das Klassensystem: Die größte Idee des Mosaiks
Hier trennt sich Mosaic von den meisten WordPress-Seitenerstellern Jedes Element kann Klassen tragen, und Klassen gibt es in zwei Geschmacksrichtungen:
- Elementklassen Definieren Sie, was etwas ist: Schaltfläche, Karte, Nav-Link
- Versorgungsklassen Definieren Sie einzelne Eigenschaften, die Sie stapeln können: Abstand, Textfarbe, Größe
Klassen verschachteln sich auch Die Button-Klasse des Monolith-Themes hat Primär - und Sekundärvarianten, jeweils mit S, M, und L-Größen Wählen Sie eine beliebige Schaltfläche, tauschen Sie ihre Unterklasse aus, und sie gestaltet sofort neu Bearbeiten Sie die Primärklasse selbst und jede Primärtaste auf der Website aktualisiert.
Wenn Sie jemals eine Elementor-Site geerbt haben, auf der jede Schaltfläche von Hand gestylt wurde, etwas anders, verstehen Sie das Problem, das dadurch gelöst wird Sie verlassen sich nicht mehr auf Disziplin, um die Stile konsistent zu halten; Die Struktur erledigt das für Sie.
Der Kompromiss ist jedoch real. Ein Klassensystem erfordert Planung. Sie müssen über Benennung, Hierarchie und Wiederverwendung nachdenken, bevor Sie bauen. Dies ist genau die Art von Overhead, die ein Freiberufler beim Ausschalten einer fünfseitigen Broschürenseite möglicherweise nicht möchte.
Komponenten-, Master- und Themengebäude
Mosaik verwaltet standortweite Layouts durch zwei verbundene Ideen:
Masters Ihre äußere Hülle sind: Kopfzeile, Fußzeile, und alles, was jede Seite umhüllt Bearbeiten Sie den Master einmal und die Änderung erscheint überall.
Vorlagen Live in Master- und Kontrollinhaltsbereichen Die Demo von Mosaic enthält Vorlagen für die Homepage, das Blogarchiv, einzelne Beiträge, Kontakt, Archiv, 404 und Suchergebnisse.
Wenn Sie eine neue Seite erstellen, fragt ein Dialog, ob eine neue Vorlage, eine bestehende oder eine automatische Vorlage zugewiesen werden soll, die Änderungen in jeder Instanz anwendet.
Komponenten Wiederverwendbare Blöcke sind: eine Preiskarte, ein Testimonial, ein CTA-Bereich Instanzen überall fallen lassen, die Komponente bearbeiten, und alle Instanzen synchronisieren.
Das ist echte Theme-Building, und es funktioniert ohne eigenes Theme Zum Vergleich erhalten Elementor-Benutzer die gleiche Abdeckung durch die Master Addons Theme Builder, das benutzerdefinierte Header, Footer, Archive, einzelne Vorlagen und 404 Seiten auf dem Editor von Elementor hinzufügt. Das Endergebnis ist ähnlich; Mosaik backt es einfach in das Kernprodukt ein, anstatt es als Zusatzschicht zu behandeln.
Interaktionen und Animationen
Mosaik enthält einen Interaktions-Builder mit zwei Trigger-Kategorien:
- Einfache Auslöser: In Ansicht scrollen, mit der Maus, klicken, Seitenladen, Richtung ändern scrollen
- Kontinuierliche Auslöser: Mausbewegung und beim Scrollen
Befestigen Sie einen Auslöser an einem beliebigen Abschnitt oder Element und definieren Sie dann, was belebt ist. Es deckt das Wesentliche der modernen Landingpage ab: Einblendungen auf der Schriftrolle, Bewegung im Parallaxenstil, Schwebezustände jenseits einfacher Farbwechsel.
Es ist ein fähiges System, wenn auch nicht revolutionär Elementor-Benutzer haben seit Jahren ähnliche Optionen durch Bewegungseffekte und Add-ons. Master Addons allein deckt ab Eingangsanimationen, schwebende Effekte und scrollbasierte Bewegungen‘dazu Extras wie Partikelhintergründe Was Mosaik bietet, ist eine engere Integration: Interaktionen leben im selben Panel wie alles andere, anstatt über Tabs verstreut zu sein.
Schleifen und dynamische Inhalte
Der Loop-Builder hat unseren Blog-Archiv-Test gut gemeistert, Du entwirfst einen Artikel (Bild, Kategorie, Titel, Auszug, Autor, Datum), und Mosaik wiederholt ihn für jeden Beitrag, komplett mit Paginierungssteuerung und einem Zustand “keine Ergebnisse”.
Schleifen verbinden sich mit Beiträgen, Seiten und benutzerdefinierten Beitragstypen und koppeln mit Vorlagenbedingungen, sodass Archive, Kategorien und Suchergebnisse jeweils das richtige Layout erhalten. In Kombination mit einer Logik der bedingten Sichtbarkeit können Sie Inhalte basierend auf dem Kontext anzeigen oder ausblenden, ähnlich wie bei Anzeigebedingungen tun dies in Elementor.
Wenn Sie inhaltslastige Seiten erstellen, ist dies einer der stärksten Bereiche von Mosaic Der Aufbau eines benutzerdefinierten Blog-Layouts fühlte sich hier schneller an als bei den meisten Buildern, die wir getestet haben Elementor-Benutzer greifen normalerweise zu einem Widget wie Blog Element Blog-Seite aufbauen, was Sie auch dorthin bringt, aber der Ansatz von Mosaic gibt Ihnen eine feinere strukturelle Kontrolle über jedes Schleifenelement.
Preise für Mosaikbauer
Die Startpreise von Mosaic sind aggressiv und eindeutig darauf ausgelegt, schnell eine Benutzerbasis aufzubauen:
| Planen | Preis | Seiten | Lizenz |
|---|---|---|---|
| Persönliche | Erstes Jahr kostenlos, dann 39 $/Jahr | 1 Website | Jährlich |
| Schöpfer | Erstes Jahr kostenlos, dann 149 $/Jahr | 10 Standorte | Jährlich |
| Agentur | 199 $ Lebensdauer (früher Vogel, regelmäßig 499 $) | Unbegrenzt | Lebenszeit |
Ein paar wissenswerte Details:
- Die Erstes Jahr kostenlos on Personal and Creator pläne ist ein Early-Bird-Angebot, das bis Ende 2026 läuft Sie zahlen jetzt nichts und das Abonnement beginnt im zweiten Jahr.
- Alle Pläne beinhalten jede Pro-Funktion Die Stufen unterscheiden sich nur in der Anzahl der Standorte und den Aktivierungsgrenzen (2 pro Jahr bei Personal, 15 bei Creator, unbegrenzt bei Agency).
- Es gibt keine permanente kostenlose Version.
Ein kostenloses Jahr mit unbegrenzten Pro-Funktionen ist ungefähr so niedrig, wie die Eintrittsbarriere wird Der 199 $ lebenslange Agenturvertrag ist ebenfalls von großem Wert, wenn das Produkt überlebt und reift.
Urteil: Ein vielversprechender Bauherr, der Zeit braucht
Mosaic Builder ist einer der interessanteren WordPress-Builder, die wir seit Jahren auf den Markt gebracht haben. Das Klassensystem ist gut ausgeführt, das Onboarding ist ausgezeichnet, die Designentwicklung ist integriert und nicht verschraubt, und die kostenlosen Preise für das erste Jahr beseitigen jede Ausrede, es nicht zu versuchen.
Unsere Empfehlung:
- Probier es mal aus Auf einem Staging - oder Nebenprojekt, vor allem wenn man CSS kennt und das Webflow-Modell mag Das freie Jahr macht das zu einem Null-Risiko-Experiment.
- Bleiben Sie bei Elementor Wenn Sie sich auf das Addon-Ökosystem verlassen, eine freie Stufe benötigen, oder den sichersten Weg für die Client-Arbeit wollen Ein gut gewählter Stack deckt heute fast alles ab, was Mosaik verspricht, weshalb Elementor unsere immer noch toppt Seitenbauer Vergleich.
Wir aktualisieren diese Mosaic Builder-Rezension, wenn eine stabile Version ausgeliefert wird. Wenn das Klassensystem auf echten Client-Sites standhält, wird Elementor einen Rivalen haben, den es wert ist, ernst genommen zu werden, und dieser Druck macht tendenziell jeden Builder besser.
Häufig gestellte Fragen
Was ist Mosaik-Builder?
Mosaic Builder ist ein neuer WordPress-Seiten-Builder und Theme-Builder. Es verwendet ein klassenbasiertes Designsystem mit wiederverwendbaren Komponenten, Stilvariablen, einem Interaktions-Builder und dynamischen Schleifen und verfolgt einen Ansatz, der näher am Webflow als an herkömmlichen WordPress-Buildern liegt.
Ist Mosaic Builder kostenlos?
Es gibt keine permanente kostenlose Version, aber die Jahrespläne von Personal und Creator sind für das erste Jahr als Frühbucherangebot bis Ende 2026 kostenlos. Danach beginnen die Pläne bei 39 $ pro Jahr für eine Website, mit einem 199 $ lebenslangen Agenturvertrag.
Können Anfänger Mosaic Builder verwenden?
Anfänger können es nutzen, aber die Lernkurve ist steiler als die von Elementor. Das Mosaik basiert auf Entwicklerkonzepten wie Kursen, Containern und Flexbox. Der mitgelieferte Videokurs hilft, aber nichttechnische Benutzer sollten echte Lernzeit einplanen.
Funktioniert Mosaic Builder mit bestehenden WordPress-Themes?
Mosaik ersetzt Ihre Theme-Ebene durch ein eigenes Masters- und Templates-System. Es wird mit zwei entworfenen Themen ausgeliefert, Gibraltar und Monolith, sowie einem Blank-Starter zum vollständigen Bauen von Grund auf.
Verwandte Lektüre: Wenn Sie Ihre Optionen abwägen, sehen Sie sich unsere Zusammenfassungen an Beste Elementorthemen und Beste leichte WordPress-Themes für Elementoroder überprüfen Was gibt es Neues in Master Addons v3.
