Revue de Mosaic Builder : nous avons testé le nouveau générateur de pages WordPress

Revue Mosaic Builder montrant l'éditeur basé sur la classe avec un navigateur de structure et des puces de classe

Un nouveau constructeur de pages vient d'atterrir dans l'espace WordPress, et il ne ressemble pas aux autres Mosaic Builder adopte une approche basée sur la classe, le système de conception-de construction de sites WordPress, plus proche de Webflow que d'Elementor Nous avons passé du temps avec cela, suivi la procédure officielle de démarrage, et construit un site à partir de zéro pour voir ce qu'il fait réellement bien.

Voici donc notre revue complète de Mosaic Builder : ce que c'est, ce que ressent l'éditeur et si vous devez lui faire confiance pour un vrai projet.

Note rapide avant de commencer : nous construisons Modules complémentaires principaux pour Elementor[TRADUCTION] ?, donc nous vivons tous les jours dans l'écosystème Elementor Cela nous donne une lentille utile pour juger un nouveau constructeur, et nous signalerons partout où notre perspective colore le verdict.

Qu’est-ce que Mosaic Builder ?

Mosaïque un créateur de page et un créateur de thème WordPress sont-ils réunis en un seul Son pitch est simple :“Tired of design limits in WordPress ? Rencontrez Mosaic.”

Au lieu de déposer des widgets sur une toile et de coiffer chacun individuellement, Mosaic est construit autour d'un système de conception Vous obtenez :

  • UN système de classes avec des classes d'éléments et des classes utilitaires, similaires à la façon dont les développeurs écrivent CSS
  • Guides de style cela contrôle les couleurs et la typographie sur l’ensemble du site
  • Composants, éléments réutilisables que vous modifiez une fois et que vous mettez à jour partout
  • Maîtres et modèles qui gèrent les mises en page au niveau du thème (en-têtes, pieds de page, archives, publications uniques)
  • Un constructeur d'interactions pour les animations par défilement, survol et clic
  • UN constructeur de boucles pour le contenu dynamique comme les archives de blogs et les types de publications personnalisés

Il est livré avec trois thèmes de démarrage : Gibraltar (gras, moderne), Monolith (propre, minimaliste) et Blank pour la construction à partir de zéro. Si vous avez utilisé Webflow ou Bricks Builder, ce modèle vous semblera familier. Si vous venez directement d'Elementor, attendez-vous à un changement mental.

Démarrage : l'assistant de configuration

L'intégration de Mosaic est meilleure que la plupart des plugins que nous avons testés Après l'activation, un assistant en quatre étapes vous guide à travers les paramètres, le maître, les modèles et les pages.

Assistant de configuration Mosaic Builder avec thème Monolith, skins de couleurs et skins de polices

La partie astucieuse est le système de skinning Choisissez un thème comme Monolith, puis choisissez une peau de couleur (Cyan, Violet, Rose, Teal, et six autres) et une peau de police (Neutre, Élégant, Intemporel, Géométrique, Moderne, Futuriste).L'ensemble du site de démonstration se restyle instantanément, y compris une bascule en mode couleur claire ou foncée.

Cela fonctionne parce que tout dans le thème fait référence à des variables de style au lieu de valeurs codées en dur Changez la couleur de la marque une fois et chaque bouton, lien et icône suit Elementor a Global Colors qui font quelque chose de similaire, mais l'implémentation de Mosaic va plus profondément puisque les thèmes de démarrage sont entièrement construits sur le système de variables dès le premier jour.

En quelques minutes, nous avons installé un site de démonstration complet : page d'accueil, archives de blogs, article de blog, page de contact avec une carte, page 404 et résultats de recherche, tous modifiables.

L'éditeur : une toile Structure-First

Ouvrir une page en Mosaïque et la mise en page est reconnaissable : arbre d'éléments à gauche, toile en direct au milieu, commandes de style à droite Mais la philosophie est différente de celle d'Elementor.

Interface de l'éditeur Mosaic Builder avec le panneau Navigator et les commandes de style

Le Navigateur de Mosaic affiche votre page comme une structure imbriquée : Section, Conteneur, Lignes, puis des éléments comme les titres, paragraphes, boutons, boîtes d'icônes, et divs. Vous sélectionnez des éléments de l'arborescence aussi souvent que du canevas Le panneau de droite expose des concepts CSS réels : largeur avec des valeurs min/max, position avec z-index, contrôles flex, transformations (traduire, mettre à l'échelle, faire pivoter), ombres de boîte, et débordement.

Pour les développeurs, c'est rafraîchissant La carte des commandes en tête-à-tête avec le CSS que vous écririez à la main, donc rien ne semble caché ou renommé Pour les débutants, c'est une colline plus raide Elementor vous permet de coiffer un cap sans savoir ce qu'est un conteneur flexible Mosaic suppose tranquillement que vous faites.

Une chose que nous avons appréciée : l'éditeur est resté réactif tout au long de notre version de test, même avec la démo complète de Monolith chargée.

Le système de classe : la plus grande idée de Mosaic

C'est là que Mosaic se sépare de la plupart des créateurs de pages WordPress Chaque élément peut transporter des classes, et les classes sont disponibles en deux saveurs :

  • Classes d'éléments définissez ce qu'est quelque chose : Bouton, Carte, Nav Link
  • Classes d'utilité définissez des propriétés uniques que vous pouvez empiler : espacement, couleur du texte, taille

Les classes nichent également La classe Bouton du thème Monolith a des variantes Primaire et Secondaire, chacune avec des tailles S, M et L. Sélectionnez n'importe quel bouton, échangez sa sous-classe, et elle restyle instantanément Modifiez la classe Primaire elle-même et chaque bouton principal sur les mises à jour du site.

Système de classe Mosaic Builder montrant la classe d'éléments de bouton avec les variantes et tailles primaires et secondaires

Si vous avez déjà hérité d'un site Elementor où chaque bouton a été stylisé à la main, légèrement différemment, vous comprenez le problème que cela résout Vous arrêtez de compter sur la discipline pour garder les styles cohérents ; la structure le fait pour vous.

Le compromis est réel, cependant Un système de classe exige la planification Vous devez penser à nommer, hiérarchie et réutilisation avant de construire, ce qui est exactement le genre de frais généraux qu'un pigiste assommant un site de brochure de cinq pages peut ne pas vouloir.

Composants, Masters et Thème Building

Mosaic gère les mises en page à l'échelle du site à travers deux idées connectées :

Maîtres votre coque externe est-elle : en-tête, pied de page et tout ce qui enveloppe chaque page Modifiez le maître une fois et le changement apparaît partout.

Modèles vivez dans les zones de contenu masters et control La démo de Mosaic comprend des modèles pour la page d'accueil, les archives de blogs, les messages uniques, le contact, les archives, le 404 et les résultats de recherche.

Mosaic Builder templates dashboard in WordPress admin affichant homepage, blog, contact, et 404 templates

Lorsque vous créez une nouvelle page, une boîte de dialogue demande s'il faut attribuer un nouveau modèle, un modèle existant ou un modèle automatique qui applique les modifications à chaque instance.

Boîte de dialogue d'attribution de modèle Mosaic Builder avec les options de modèle nouvelles, existantes et automatiques

Composants sont des blocs réutilisables : une carte de tarification, un témoignage, une section CTA. Abandonnez les instances n'importe où, modifiez le composant et synchronisez toutes les instances.

Il s'agit d'une véritable construction de thèmes, et cela fonctionne sans thème distinct, À titre de comparaison, les utilisateurs d'Elementor obtiennent la même couverture grâce au Constructeur de thèmes Master Addons(en anglais), qui ajoute des en-têtes personnalisés, des pieds de page, des archives, des modèles uniques et 404 pages au-dessus de l'éditeur d'Elementor Le résultat final est similaire ; Mosaic se contente de le faire entrer dans le produit de base plutôt que de le traiter comme une couche complémentaire.

Interactions et animations

Mosaic comprend un constructeur d'interaction avec deux catégories de déclencheurs :

  • Déclencheurs simples: faites défiler la vue, survolez, cliquez, chargez la page, faites défiler le changement de direction
  • Déclencheurs continus : mouvement de la souris et en faisant défiler

Attachez un déclencheur à n'importe quelle section ou élément, puis définissez ce qui anime. Il couvre les éléments essentiels de la page d'atterrissage moderne : les fondues sur le parchemin, les mouvements de type parallaxe, les états de survol au-delà des simples échanges de couleurs.

C'est un système performant, bien que non révolutionnaire Les utilisateurs d'Elementor ont des options similaires depuis des années grâce aux effets de mouvement et aux addons Master Addons couvre seul animations d'entrée, effets flottants et mouvements basés sur des parchemins[TRADUCTION], plus des extras comme les fonds de particules Ce que propose Mosaic, c'est une intégration plus serrée : les interactions vivent dans le même panneau que tout le reste au lieu d'être dispersées sur des onglets.

Boucles et contenu dynamique

Le constructeur de boucles a bien géré le test de nos archives de blog. Vous concevez un élément (image, catégorie, titre, extrait, auteur, date) et Mosaic le répète pour chaque article, avec des contrôles de pagination et un état de “no results”.

Constructeur de boucles Mosaic Builder créant une disposition dynamique des archives de blog avec pagination

Les boucles se connectent aux publications, aux pages et aux types de publications personnalisés, et s'associent aux conditions du modèle afin que les archives, les catégories et les résultats de recherche obtiennent chacun la bonne mise en page. Combiné à une logique de visibilité conditionnelle, vous pouvez afficher ou masquer du contenu en fonction du contexte, similaire à quoi les conditions d'affichage le font dans Elementor.

Si vous créez des sites riches en contenu, c'est l'un des domaines les plus forts de Mosaic Construire une mise en page de blog personnalisée ressentie ici plus rapidement que dans la plupart des constructeurs que nous avons testés Les utilisateurs d'Elementor recherchent généralement un widget comme Blog Element construire une page de blog(en), ce qui vous y amène aussi, mais l'approche de Mosaic vous donne un contrôle structurel plus fin sur chaque élément de boucle.

Prix du constructeur de mosaïque

Les tarifs de lancement de Mosaic sont agressifs, clairement conçus pour créer rapidement une base d'utilisateurs :

PlanPrixSitesLicence
PersonnelGratuit la première année, puis 39 $/an1 siteAnnuel
CréateurGratuit la première année, puis 149 $/an10 sitesAnnuel
Agence199 $ à vie (premier oiseau, 499 $ réguliers)IllimitéLa vie

Quelques détails qui méritent d'être connus :

  • Le première année gratuite sur les plans personnels et créateurs est une offre early-bird qui se déroule jusqu'à la fin de 2026. vous ne payez rien maintenant et l'abonnement commence dans l'année deux.
  • Tous les forfaits incluent chaque fonctionnalité Pro. Les niveaux diffèrent uniquement par le nombre de sites et les limites d'activation (2 par an sur Personal, 15 sur Creator, illimité sur Agency).
  • Il n'existe pas de version gratuite permanente.

Une année gratuite avec des fonctionnalités Pro illimitées est à peu près aussi basse que la barrière à l'entrée l'obtient L'accord de l'Agence à vie de 199 $ est également une valeur forte si le produit survit et mûrit.

Verdict : un constructeur prometteur qui a besoin de temps

Mosaic Builder est l'un des constructeurs WordPress les plus intéressants que nous ayons vu lancer depuis des années Le système de classe est bien exécuté, l'intégration est excellente, la construction du thème est intégrée plutôt que boulonnée, et la tarification gratuite de première année supprime toute excuse pour ne pas l'essayer.

Notre recommandation:

  • Essayez-le sur une mise en scène ou un projet parallèle, surtout si vous connaissez le CSS et aimez le modèle Webflow L'année libre en fait une expérience à risque zéro.
  • Restez fidèle à Elementor si vous comptez sur l'écosystème d'addon, avez besoin d'un niveau gratuit ou souhaitez le chemin le plus sûr pour le travail client. Une pile bien choisie couvre presque tout ce que Mosaic promet aujourd'hui, c'est pourquoi Elementor arrive toujours en tête de notre comparaison des constructeurs de pages.

Nous mettrons à jour cette revue de Mosaic Builder lorsqu'une version stable sera livrée Si le système de classes tient le coup sur de vrais sites clients, Elementor aura un rival qui vaut la peine d'être pris au sérieux, et cette pression tend à rendre chaque constructeur meilleur.

Foire aux questions

Qu'est-ce que Mosaic Builder ?

Mosaic Builder est un nouveau constructeur de pages et constructeur de thèmes WordPress Il utilise un système de conception basé sur les classes avec des composants réutilisables, des variables de style, un constructeur d'interactions et des boucles dynamiques, en adoptant une approche plus proche de Webflow que des constructeurs WordPress traditionnels.

Mosaic Builder est-il gratuit ?

Il n'existe pas de version gratuite permanente, mais les forfaits annuels personnels et créateurs sont gratuits pour la première année en tant qu'offre à début d'oiseau jusqu'à fin 2026. Après cela, les forfaits commencent à 39 $ par an pour un site, avec un contrat à vie de l'agence de 199 $.

Les débutants peuvent-ils utiliser Mosaic Builder ?

Les débutants peuvent l'utiliser, mais la courbe d'apprentissage est plus raide que celle d'Elementor. Mosaic est construit autour de concepts de développeurs tels que les cours, les conteneurs et la flexbox. Le cours vidéo inclus est utile, mais les utilisateurs non techniques doivent budgétiser le temps d'apprentissage réel.

Mosaic Builder fonctionne-t-il avec les thèmes WordPress existants ?

Mosaic remplace votre couche thème par son propre système Masters et Modèles Il est livré avec deux thèmes conçus, Gibraltar et Monolith, plus un démarreur vierge pour construire complètement à partir de zéro.

Lecture connexe: Si vous évaluez vos options, consultez nos résumés du meilleurs thèmes Elementor et meilleurs thèmes WordPress légers pour Elementor(ou) vérifier nouveautés dans Master Addons v3.

Photo de Roy Jemee
Roy Jemee
Je suis Roy Jemee, Content Wrangler et Marketer chez Pixar Labs, travaillant sur Master Addons pour Elementor J'écris les tutoriels, enregistre les vidéos, et garde la documentation à jour, donc vous savez toujours comment utiliser chaque fonctionnalité Je gère aussi le support, donc si vous frappez un accroc, je suis la personne qui vous aide à y répondre de vraies réponses, de la part de quelqu'un qui utilise ces outils tous les jours.
Septembre Vente

40% de tout

Chaque plan Master Addons Pro, annuel et à vie Un code, huit jours.

00jours
00heures
00min
00sec

Se termine le lundi 14 septembre, à 23 h 59 HE

  • Personnel1 site 129 $77 $
  • Entreprise5 sites 199 $119 $
  • DéveloppeurSites illimitésMeilleur pour les agences 599 $359 $

Payer une fois. Aucun renouvellement, jamais.

Code coupon MALIFE40
Obtenez 40 % de réduction maintenant
  • Plus de 30 000 installations actives
  • 4,5/5 sur 212 avis
  • remboursement de 14 jours