Beaver Builder vs Divi : Un est bon pour vous, un ne l'est pas (2024)

Donc, vous recherchez un nouveau plugin de création de page WordPress. Comment choisir entre Beaver Builder ou Divi alors que ce sont deux des produits les plus populaires ?

Vous avez peut-être effectué des recherches préliminaires et avez constaté que ces deux choix sont les plus prisés pour la création de sites Web et fournissent des outils similaires à d'autres constructeurs de pages de premier plan.

Vous voulez maintenant savoir lequel de ces plugins populaires est le meilleur. Et surtout, qui vaut votre argent?

Nous allons explorer toutes les fonctionnalités importantes de ces plugins de création de pages et les comparer pour vous aider à trouver celui qui vous convient le mieux.

Lisez la suite pour savoir quel est le meilleur plugin de création de page pour WordPress. Si vous êtes intéressé par les plugins WordPress en général, vous voudrez peut-être consulter nos autres critiques et résumés présentés sur Collectiveray.

Nous avons des sites fonctionnant avec ces deux produits installés, nous avons donc revisité cet article en avril 2024 pour mettre à jour tous les détails pertinents si nécessaire.

Beaver Builder contre Divi

Beaver Builder est très facile à utiliser mais Divi a plus d'options de personnalisation. Les deux produits vous donnent accès à des mises en page d'aspect professionnel. Divi a plus de 2,000 mises en page par rapport à Beaver Builder's 50 modèles. Divi est légèrement moins cher que Beaver Builder à 89 $ qui comprend tous les produits de ElegantThemes.

Prix	89 $ (comprend tous les plugins ET et les thèmes WordPress)	$99 +
Version gratuite	Non	Oui
Editeur en temps réel	Oui	Oui
Frontend/Backend	Les deux	Les deux
Public cible	Développeur / Designer / Utilisateur	Web Developer / Designer
Éléments pris en charge	200+	31
Code propre	Oui	Oui
Modèles / mises en page prédéfinis	2,000+	50+
Fonctionnalité cool	Test A / B	Castor Themer
Performance	⭐⭐⭐⭐⭐	⭐⭐⭐⭐
Ce que nous avons aimé	Une solution très puissante pour créer tout type de mise en page	Une interface utilisateur simple
	Options de gestion de la mise en page supérieures	Le contenu reste intact même après la désactivation du plugin
	Prix ​​attractifs avec accès à de nombreux autres thèmes et plugins WordPress	Mode éditeur unique pour les clients
	De nouvelles améliorations de performances changent la donne	Vous permet d'utiliser des widgets WordPress dans les mises en page
Ce que nous n'avons pas aimé	Il faut du temps pour s'habituer	Plus cher que les autres constructeurs de pages
	L'éditeur frontal prend un certain temps à se charger.	Pas autant de ressources
En Conclusion:	⭐⭐⭐⭐⭐	⭐⭐⭐⭐
Gagnant	?????
Site Web	Rendez-vous sur Elegant Themes (10% OFF)	Rendez-vous sur Beaver Builder

Pourquoi utiliser un constructeur de pages ?

Si vous êtes relativement nouveau dans le monde WordPress, vous ne connaissez peut-être pas l'histoire complète des constructeurs de pages et comment ils sont nés.

Essentiellement, jusqu'à il y a quelques années, WordPress pouvait créer des pages ou des articles. Ces deux éléments de contenu sont très similaires.

Ils ont principalement pris en charge le texte et les images et le contenu de votre site Web ordinaire, tel que les articles de blog.

Si vous vouliez quelque chose de plus sophistiqué, vous deviez utiliser des plugins et / ou des shortcodes si nécessaire.

Désormais, les codes courts étaient excellents, car ils vous permettaient d'insérer des fonctionnalités et des fonctions spécifiques où vous le souhaitiez sur une page.

Mais ils avaient toujours leurs limites - vous deviez toujours installer un tas de plugins différents pour pouvoir atteindre et utiliser plusieurs éléments différents sur une page.

Si vous vouliez des curseurs, des boutons d'appel à l'action, des vidéos, des galeries d'images et d'autres choses, vous deviez continuer à ajouter de plus en plus de plugins.

Cela entraînait un autre problème: plus vous ajoutez de produits à votre installation, plus votre site Web serait lourd et plus il était sujet à des vulnérabilités de sécurité provenant des différents éléments que vous deviez installer.

C'était un problème.

Il y avait un autre problème. Vous n'avez pas pu créer de page ou de message visuellement. Vous deviez concevoir une page en utilisant des shortcodes et après plusieurs itérations de modifications, vous arriviez à un résultat proche de ce que vous souhaitiez.

Finalement, les développeurs et les fournisseurs ont commencé à se rendre compte que la plupart des gens voulaient pouvoir concevoir et définir leurs propres pages sans contraintes - et non utiliser des modèles, ce qui donnait à tous les sites Web la même apparence.

Et ainsi, le concept de constructeurs de pages est né.

C'est essentiellement le cœur d'une telle fonctionnalité - la possibilité de faire glisser et déposer différents éléments pour concevoir et définir une page ou un article de la manière que VOUS le souhaitez.

Lire la suite: Assistant Pro - enregistrez les modèles de création de pages sur le Web

Nous ne savons pas trop qui a créé le produit de création de première page, mais certainement, Elegant Themes ont été l'un des vendeurs à rendre ce concept très très réussi.

Dès que les gens ont vu le potentiel, tous les principaux fournisseurs ont commencé à prendre le train en marche.

Aujourd'hui, la plupart des principaux fournisseurs intégreront une sorte de constructeur de page visuel dans leur thèmes - s'ils n'en ont pas eux-mêmes, ils s'associeront à quelqu'un et intégreront / activeront cette fonctionnalité dans leur thème.

Alors qu'en est-il de Divi et Beaver Builder?

Divi

ElegantThemes sont dans ce créneau depuis si longtemps qu'ils ont vraiment compris ce que les gens veulent et le leur ont donné - leur produit est l'un des plus populaires, avec plus de 600,000, 880,000 XNUMX ventes.

Ils se concentrent sur les utilisateurs qui veulent créer un site Web mais ne sont pas dérangés par ce qui se passe sous le capot - ils veulent juste que les choses fonctionnent et ne veulent pas devenir techniques à ce sujet ou jouer avec du code.

Elegant Themes Audience cible: 

Les personnes qui souhaitent concevoir et faire fonctionner un site Web sans impliquer un développeur or en savoir plus sur le code.

Exemples d'utilisateurs:

1. Propriétaires de petites entreprises
2. Bloggers
3. SEO
4. Propriétaires de sites Web affiliés
5. Rédacteurs de contenu qui créent des sites Web
6. Concepteurs de sites Web
7. Agences de marketing digital

Si vous deviez jeter un œil à l'image ci-dessous, Divi s'adresse au concepteur. En fait, vous voudrez peut-être vérifier certains exemples de thèmes Divi en direct ici. Et ces gars-là sont toujours à la pointe de la technologie, venant juste d'intégrer L'IA dans Divi.

Beaver Builder

Beaver Builder a un type d'utilisateur différent. Tandis que ElegantThemes cible ceux qui sont less "technique", Beaver Builder s'en prend aux utilisateurs qui sont des concepteurs et des développeurs dans l'âme.

Divi a certaines limitations que ces types de développeurs trouvent frustrantes, et Beaver Builder identifie et corrige bien ces problèmes. 

Cela a permis à ce produit de décoller auprès de ceux qui s'identifient davantage comme développeurs.

Si vous êtes intéressé par la façon dont Elegant Themes produits se comparent à d'autres options populaires disponibles sur le marché, vous voudrez peut-être considérer les deux articles suivants que nous avons également écrits :

https://www.collectiveray.com/divi-vs-genesis

et

https://www.collectiveray.com/divi-vs-avada

En continuant sur l'image ci-dessus, Beaver Builder serait plus à l'aise avec le développeur.

Public cible de BeaverBulder:

Développeurs Web et designers qui aiment à bricoler avec le code, avoir le contrôle total de ce qui se passe et pouvoir modifier les choses pour les faire fonctionner comme ils le souhaitent, et non comme le fournisseur l'a conçu.

Exemples d'utilisateurs:

1. Les développeurs Web
2. Les concepteurs Web qui veulent bricoler le code
3. Agences numériques
4. Freelancers

Avec cette introduction à l'écart, commençons à creuser dans chaque produit, afin que nous puissions voir les caractéristiques, les fonctions, les avantages et les inconvénients de l'utilisation de l'un ou l'autre de ces deux éléments.

Commençons par discuter de l'interface utilisateur de ces deux produits.

Beaver Builder vs Divi - Interface utilisateur et UX du constructeur de pages WordPress

Comme nous avons tendance à passer beaucoup de temps sur le back-end de notre constructeur de pages, regardons d'abord à quoi ressemble chacun d'eux et ce qu'ils offrent en termes de convivialité.

La Divi Builder Interfaces

ElegantThemes travaillent sur leur produit depuis plusieurs années et ça se voit. Avec une communauté solide qui les soutient, leur donnant beaucoup de bons commentaires, ces gars savent comment rester à l'écoute de leurs utilisateurs.

Ils ont construit une interface entièrement axée sur une expérience utilisateur exceptionnelle.

Ils n'ont pas construit des tas de fans par accident. Leur concentration stricte sur la conception et la convivialité de leur produit a été l'un des aspects clés du succès de ce constructeur.

Jetez un œil à cette courte vidéo d'introduction (2 minutes). C'est à partir de la toute première version de Divi (2015), beaucoup de choses ont changé depuis, mais c'est super d'avoir un rapide résumé des possibilités.

Mais jetons un coup d'œil à l'interface utilisateur.

Après avoir installé Divi, vous pourrez accéder au constructeur en créant un nouveau post ou une nouvelle page.

La première chose que vous allez voir est celle-ci :

En cliquant sur le Utilisez Divi Builder bouton vous redirigera vers le nouvel éditeur visuel.

Cette fonction est en réponse à l'introduction du nouvel éditeur de blocs WordPress comme vous pouvez le voir sur l'image ci-dessus. L'ancien éditeur back-end Divi n'est plus disponible pour être utilisé avec le nouvel éditeur de publication.

Voilà pourquoi Elegant Themes se sont concentrés sur l'amélioration de leur éditeur visuel front-end et ont fait en sorte que le back-end et le front-end soient désormais jointslessment intégrés les uns aux autres.

Cependant, vous avez toujours la possibilité de revenir non seulement à l'éditeur backend Divi classique, mais également à l'éditeur de publication WordPress classique.

Tout ce que vous avez à faire est d'aller à Divi > Options du plugin > Avancé.

Basculez le "Activer l'éditeur classique»Sur Activé pour ramener l'éditeur de publication WordPress d'origine.

L'activation de cette option ramènera également l'éditeur back-end complet de Divi. Ensuite, basculez le « Activer les dernières Divi Builder De l'expérience" to disabled ramènera le constructeur de backend pré-Gutenberg Divi (cependant, gardez à l'esprit que vous perdrez certaines des dernières fonctionnalités et améliorations du constructeur moderne).

L'éditeur en temps réel frontal vous permet désormais de concevoir et de visualiser la page sur laquelle vous travaillez à la volée.

C'est franchement une fonctionnalité intéressante car vous n'avez pas à "deviner" ou à actualiser le frontal pour voir le résultat de la conception sur laquelle vous travaillez.

Vous pouvez le voir au fur et à mesure que vous le concevez.

C'est quoi ElegantThemes appellent "Une nouvelle expérience visuelle".

Le nouveau constructeur visuel de Divi a remplacé les anciens éditeurs back-end / front-end.

Ci-dessous, vous pouvez voir à quoi ressemble le nouveau constructeur. Remarquez comment vous pouvez coudrelessBasculez simplement entre la vue principale (filaire) et la vue frontale d'un simple clic de souris.

Il s'agit d'une expérience WYSIWYG complète (ce que vous voyez est ce que vous obtenez). 

Pour accéder au pagebuilder depuis le backend, rendez-vous sur Poteaux > Ajouter un nouveau.

Vous verrez une nouvelle page avec trois options, Construire à partir de zéro, Choisir une mise en page prédéfinie ou cloner une page.

Une fois que vous avez fait votre choix, vous verrez soit une option pour créer une nouvelle page, pour choisir dans la liste des modèles ou choisir une page à cloner.

Nous choisirons de créer une page à partir de zéro afin que vous puissiez voir ce qui se passe.

Sur la page résultante, cliquez sur le "Utilisez le Divi Builder" bouton. Cela ouvrira l'interface, qui ressemble à ce qui suit

Divi (que nous avons déjà examiné ici) vous permet de créer des sections distinctes pour différentes parties de la page. Il prend en charge trois types de sections: standard, pleine largeur et spécialisée.

Pour les sections standard et pleine largeur, vous pouvez choisir une structure basée sur des colonnes. Il existe de nombreuses combinaisons, dont deux, trois, quatre colonnes de différentes tailles.

La section spécialisée comprend neuf structures de colonnes spécialement créées. Vous pouvez ajouter plusieurs lignes dans une section pour avoir plusieurs structures de colonnes.

Une fois que vous avez choisi une mise en page, vous pouvez ajouter des modules aux colonnes individuelles. Vous trouverez des options distinctes pour fournir le contenu du module, configurer les options de conception et fournir un CSS personnalisé.

Vous pouvez repositionner les modules, les colonnes, les lignes et les sections en les faisant glisser et en les déposant aux emplacements souhaités. Il existe des boutons dédiés pour supprimer, dupliquer et ouvrir la section des paramètres pour chacun de ces éléments.

Il est également possible d'annuler, de refaire les dernières actions et de revenir aux actions précédentes en utilisant la fonction d'historique.

Une fois le générateur de page frontal chargé, vous pouvez commencer à personnaliser la page.

Comme l'interface backend, vous pouvez ajouter une nouvelle section, choisir la structure des colonnes et profiter d'un accès complet à toutes les options de paramètres du module.

Bien sûr, un concepteur sans glisser-déposer est mort dans l'eau, mais bien sûr, ce produit le gère très bien.

En fait, non seulement le glisser-déposer, mais il maintient également la réactivité lors de la conception.

Étant donné que vous travaillerez sur les blocs de contenu et d'éléments en direct, vous allez faire glisser les éléments de contenu réels.

Et bien sûr, tout est toujours totalement réactif.

Jetez un œil à la courte démo suivante de blocs réactifs en direct.

Vous pouvez faire glisser et déposer les modules, les lignes, les colonnes et également les copier, coller, supprimer ou modifier ceux-ci en fonction de vos besoins. 

Bénéficiez de 10% de réduction sur Divi jusqu'en avril 2024

PS. L'offre ci-dessus est uniquement disponible via CollectiveRay.

Alors, qu'en est-il? ElegantThemes concurrent? Fait Beaver Builder avoir la même flexibilité ? Est-ce que ça marche en temps réel dans le front-end ?

Lisez le reste de cet article pour trouver la réponse à ces questions. 

La Beaver Builder Interfaces

Ne voulant pas être laissé pour compte dans la course à la domination des constructeurs de pages, Beaver Builder est sorti avec tous les canons flamboyants.

Ou des grincements de dents, si nous voulons garder l'analogie du castor. 😀

Beaver Builder offre à la fois l'édition dans le frontend et le backend, donc il ne traîne pas à cet égard.

Il peut être utilisé sur les pages, les publications et la plupart des autres types personnalisés WordPress, tant qu'ils ont été activés.

En cliquant sur l'onglet Admin pour le type personnalisé approprié, vous verrez le générateur en cours de chargement afin que vous puissiez l'utiliser pour concevoir votre contenu.

Avant de continuer, vous pouvez visionner la courte vidéo suivante (2 minutes) sur l'utilisation Beaver Builder.

Essentiellement, dans la méthode backend, après vous être d'abord connecté à votre tableau de bord, accédez à Poteaux > Ajouter un nouveau, et cliquez sur le "Page Builder"Bouton.

Cela fera apparaître l'interface du constructeur de pages - quelque chose de similaire à ce qui suit.

La première étape consiste à choisir un modèle pour la page. Vous pouvez choisir l'un des modèles prêts à l'emploi ou commencer avec le modèle vierge pour créer votre propre modèle.

Une fois que vous avez choisi le modèle, l'étape suivante consiste à choisir la disposition des lignes.

Vous pouvez choisir la disposition des lignes dans la barre latérale gauche. Ouvrez la barre latérale en cliquant sur "Ajouter du contenu” dans le menu en haut à gauche de la page.

Le menu propose également quelques autres boutons pour changer de modèle, ouvrir les outils, la section, publier la page et un bouton d'aide dédié.

Beaver Builder propose plusieurs structures de colonnes, dont une, deux, trois, quatre, cinq ou six colonnes et des lignes avec des barres latérales gauche, droite ou les deux.

Faites simplement glisser la disposition des lignes dans la position souhaitée sur la page.

L'étape suivante consiste à ajouter des modules aux colonnes. Vous trouverez les modules dans la barre latérale gauche.

Choisissez le module que vous souhaitez utiliser et faites-le glisser vers la colonne souhaitée sur la page. À ce stade, la fenêtre des paramètres du module s'affichera.

Il existe plusieurs sections pour gérer le contenu et le style du module.

Vous pouvez faire glisser et déposer les lignes et les modules pour modifier leur position. Il existe des boutons distincts pour supprimer, dupliquer ou ouvrir les paramètres de n'importe quelle ligne ou module.

Il est également possible de modifier la structure des colonnes d'une ligne.

Pour accéder au constructeur de pages depuis le frontend, visitez la page que vous souhaitez modifier et cliquez sur le bouton "Page Builder" bouton. Cela ouvrira la même interface que la création de la page à partir du backend.

Vous pouvez travailler avec la conception existante ou choisir une nouvelle disposition. Toutes les autres options telles que l'ajout de différentes lignes, modules, widgets et leur gestion sont exactement les mêmes que le backend.

Souhaitez-vous voir une démo gratuite en direct de Beaver Builder à présent? Cliquez sur le bouton ci-dessous. (Ouvre dans une nouvelle fenêtre)

Essaie le BeaverBuilder demo

Beaver Builder contre Divi - Modules

La convivialité n'est qu'un aspect d'un constructeur de page. Le nombre de modules qu'il fournit sans avoir à installer de plugins supplémentaires compte également.

Divi Builder

Ce plugin est actuellement livré avec plus de 200 modules de contenu (Elements en Divi-speak).

En parlant de nouvelles versions, la nouvelle mise à jour des performances de Divi lancée en août 2021 a envoyé Divi en tête de la file d'attente des thèmes WordPress.

La page construite à l'aide de la nouvelle version de Divi se charge plus rapidement que jamais grâce à une série d'améliorations de code sous le capot.

Les nouvelles versions de Divi, comme la 4.20 publiée en février 2023, ont considérablement amélioré son fonctionnement et sa vitesse de chargement.

Ces améliorations comprennent :

• 94% plus petit CSS
• CSS intelligent qui ne charge que ce qui est nécessaire
• Les styles intelligents réduisent la duplication entre les feuilles de style pour un chargement plus rapide
• PHP dynamique pour un traitement plus rapide
• Optimisation JavaScript
• Report de la feuille de style Gutenberg
• report jQuery

Parmi ceux-ci, vous trouverez les plus réguliers comme:

• Texte
• Rechercher
• Accordéon
• Bouton
• CTA
• Audio
• Vidéo
• Code personnalisé
• Cloison

Les choix avancés d'éléments incluent:

• Counter
• Opter
• Portefeuille
• Connexion
• Carte
• Personne
• Tableau de prix
• Testimonial
• Curseur vidéo

Bien sûr, ce ne sont pas les seuls modules disponibles, mais si nous continuions à les lister, étant donné qu'il y a plus de 200 éléments pris en charge, nous serions là pour toujours.

Disons simplement que vous êtes le plus susceptible de trouver un module pour toutes les exigences dont vous aurez besoin.

Ensuite, il existe des plugins de modules supplémentaires pour les quelques modules dont vous pourriez avoir besoin mais que Divi n'a pas.

Avec la version 3.1, une API a été développée et publiée, vous pouvez vous attendre à ce que des éléments et des modules personnalisés commencent à apparaître partout.

Des moments amusants à venir!

Voyons ce que les autres développeurs proposeront. Restez à l'écoute.

Mais assez à ce sujet, voyons comment utiliser un module:

Cliquez sur le module souhaité pour l'ajouter à l'article. À ce stade, vous devez configurer les paramètres du module. 

Le constructeur de pages vous propose trois sections à cet effet:

1. Contenu
2. Conception
3. Avancé

La Contenu La section comprend toutes les options concernant le contenu du module choisi.

Conception vous permet de choisir la couleur, la police, le style d'arrière-plan, la bordure, la marge et le remplissage du module.

Enfin, le Avancé inclut des champs dédiés pour ajouter un ID CSS personnalisé, une classe et pour appliquer un CSS personnalisé avant ou après le module ou au contenu principal.

Souhaitez-vous lire plus d'informations sur ce plugin maintenant ? Cliquez sur le bouton ci-dessous pour visiter le ElegantThemes en ligne.

Bénéficiez de 10% de réduction sur Divi jusqu'en avril 2024

PS. L'offre n'est disponible qu'à partir du lien ci-dessus. 

Beaver Builder

Beaver Builder compte 29 modules en tout et les divise en trois catégories :

1. Modules standard
2. Widgets WordPress
3. Modules enregistrés

Les modules standards comprennent :

• Éditeur de texte
• Titre
• HTML
• Bouton
• Image(s)
• Vidéo
• acoustique
• Séparateur

La catégorie WordPress contient quelques modules familiers :

• Archives
• Calendrier
• Catégories
• Meta
• RSS
• menu de navigation
• Et d'autres

La section Modules enregistrés présentera tous les modules que vous créez et enregistrez pour une utilisation ultérieure.

Le plugin propose trois sections pour gérer un module :

1. Général
2. Style
3. Avancé

Parmi ceux-ci, le Général La section vous permet de configurer les paramètres liés au type de module.

La Style La section vous permet de choisir la couleur, l'alignement, la police et d'autres styles pour les versions de bureau et mobiles.

Avancé comprend des options pour configurer la visibilité, l'animation ainsi que des champs dédiés pour l'ajout de classe CSS et d'ID.

Vous pouvez voir une démo plus claire du BeaverBuilder caractéristiques ci-dessous.

Rendez-vous sur Beaver Builder Site Web

La prochaine partie de notre Beaver Builder vs Divi review traitera des modèles de page disponibles ou des mises en page prédéfinies.

C'est quelque chose qui vous simplifiera la vie et vous permettra de concevoir de nouveaux sites Web en quelques heures, voire quelques minutes, au lieu de plusieurs semaines.

Voyez ci-dessous ce que nous voulons dire!

Beaver Builder vs Divi - Modèles de page intégrés

Les modèles de page intégrés sont essentiellement là pour raccourcir votre temps de conception / développement. En les mettant en place, il vous suffit de modifier légèrement le contenu et la conception et vous êtes prêt à partir!

Divi Builder Modèles de page (alias mises en page)

Lors de la sortie de la version 3.0, elle était fournie avec plusieurs (plus de 100) modèles prêts à l'emploi pour vous aider à démarrer le plus rapidement possible.

Les versions suivantes en ont ajouté d'autres, le nombre s'élevant désormais à plus de 2,000 XNUMX !

Vous pouvez utiliser un modèle en cliquant sur l'option "Choisir une mise en page prédéfinie" lorsque vous chargez une nouvelle page ou un nouveau message pour la première fois.

Vous trouverez des mises en page professionnelles pour la page de destination, à venir, à propos de moi, contactez-nous, l'équipe, la page de maintenance ainsi que plusieurs variantes pour la page d'accueil, le blog, la boutique et les pages de portfolio.

Il est possible d'utiliser ces mises en page telles quelles ou de les personnaliser selon vos besoins.

Bien sûr, on peut avoir un assez grand nombre de modèles (ou comme Divi les appelle) de mises en page, mais la vraie viande est de savoir s'ils sont réellement bons et utilisables pour créer vos propres conceptions.

Essentiellement, l'idée de base est la suivante - vous créez une page dans WordPress, chargez une mise en page prédéfinie, puis vous personnalisez le texte, les images et tout autre contenu en fonction de votre entreprise et - voila - vous avez un site Web "conçu" incroyable sans nécessiter de réelles connaissances en conception.

C'est une grande puissance entre les mains de ceux qui veulent mettre les choses en marche rapidement mais qui ne sont pas très à l'aise avec le code ou la conception en soi.

Juste un FYI - il y a plus de 2,000 mises en page disponibles au moment de la rédaction de cet article.

Voyons rapidement ce qui est disponible en termes de mises en page.

Packs de sites Web complets

Il s'agit ici d'une fonctionnalité qui, selon nous, est idéale pour le public cible auquel ce produit est destiné. Étant donné que nous avons mentionné que le public était constitué de personnes qui souhaitent lancer quelque chose rapidement, la disponibilité de packs de sites Web complets est vraiment ablessING.

Essentiellement, il s'agit d'un ensemble des 7 à 8 pages essentielles conçues individuellement pour que quelqu'un puisse simplement lancer un site complet en quelques minutes. 

Regardez comment Nick Roach d'ET décrit la valeur que les mises en page apportent à ce produit. (Oui, vous remarquerez que les cheveux de Nick sont plus longs, un certain temps s'est écoulé entre les deux vidéos!).

Les pages sont personnalisées pour le créneau / l'industrie spécifique, avec les éléments essentiels requis pour ce type d'entreprise spécifique.

Tout ce que vous devez faire en tant qu'utilisateur est d'importer la conception et de modifier le contenu en fonction de vos besoins spécifiques.

Voici quelques-unes des niches disponibles sous forme de packs de sites Web. À l'heure actuelle, 31 packs de mise en page sont disponibles avec un total de 250 pages conçues.

• Page de destination du restaurant - il s'agit d'un pack composé de 8 pages pour fournir tout ce qu'un restaurant ou une entreprise alimentaire pour lancer sa présence en ligne, y compris les heures d'ouverture dans le pied de page pour un accès facile par les clients.

• Agence de design - le pack agence de design est un ensemble de 9 pages de pages conçues de manière créative et professionnelle pour une agence numérique ou de design. Bien sûr, la priorité est donnée au travail et au style, mettant en valeur les compétences de l'entreprise d'une manière qui convertit
• Page de destination de la mode - Un secteur qui doit sûrement avoir une belle apparence en ligne est un blog de mode. Ce pack de mise en page de 8 pages vise à permettre au blogueur de marquer son image si nécessaire. Tout est parfait pour les photographes et autres entreprises visuelles.
• Agence de voyage - la conception ici met fortement l'accent sur l'utilisateur visitant le site qui prend des mesures, poussant et exhortant le spectateur actuel à appeler ou à réserver maintenant avec des boutons d'appel à l'action attrayants.
• Page d'accueil de mariage - un moyen idéal pour lancer rapidement une vitrine de mariage. Il se concentre bien sûr beaucoup sur l'esthétique et de nombreuses autres fonctionnalités personnalisées spécifiques aux mariages.
• Entreprise SaaS - un autre type d'entreprise, généralement des startups, qui ont généralement peu de temps à perdre et doivent se mettre en marche rapidement. Ce pack de mise en page leur donne tout ce dont ils ont besoin pour être opérationnels et obtenir les informations nécessaires.

Il existe de nombreuses autres mises en page disponibles, y compris, mais sans s'y limiter:

• Système de gestion d'apprentissage
• Café
• Marché des fermiers
• Studio de yoga ou de fitness
• Marché de la photo
• Rédacteur
• Fleuriste
• Agence Web
• Entreprise de design d'intérieur
• Activité de paiements numériques
• Atelier de poterie et d'artisanat
• Agence de référencement
• Conseil aux entreprises
• Conférence de design
• Recettes alimentaires
• Law Firm
• Auteur
• etc.

Au fil du temps, ET continue d'ajouter de plus en plus de mises en page à sa bibliothèque pour répondre à des niches spécifiques. Même si votre secteur d'activité spécifique n'a pas été pris en compte pour le moment, vous serez certainement en mesure de personnaliser l'une des mises en page existantes et conçue pour répondre à vos besoins.

Découvrez toutes les mises en page maintenant

Beaver Builder Page Templates

Beaver Builder est également livré avec de nombreux modèles conçus par des professionnels. Il vous sera demandé de choisir un modèle lors de la création d'un nouveau message.

Il est également possible de changer le modèle actuel en cliquant sur le bouton « Modèles ».

Il existe trois types de mises en page :

• Landing Pages
• Pages de contenu
• Micro-pages

Les pages de destination inclure des modèles pour les produits physiques, les applications, les professionnels, les restaurants, la technologie, la mode, la photographie, le mobile, la musique, l'automobile, etc.

Les pages de contenu incluez des modèles pour les pages de site Web nécessaires comme à propos de nous, services, portfolio, équipe, contact, FAQ, blog, etc. La plupart de ces modèles sont disponibles dans différents styles.

Micro-pages sont de petites pages qui peuvent fonctionner seules ou être intégrées dans une autre page.

Comme les modèles sont fournis avec une image, vous pouvez facilement choisir le meilleur en fonction de vos besoins.

Examinons un peu plus en détail ce qui est disponible pour vous en tant que client de Beaver Builder.

Landing Pages

Beaver Builder a conçu plusieurs modèles de pages de destination prêts à l'emploi. Parmi ceux-ci, nous pouvons trouver :

• Modèle de petite entreprise - basé sur le modèle Probiz, cela vous aidera à créer rapidement une présence pour une petite entreprise.
• Modèle Fitness, Gym ou Sporty - Le fitness et le sport sont toujours un créneau en vogue et le modèle The Body Factory est spécialement conçu pour les clients de ce secteur. Le yoga, la gym ou toute autre industrie du fitness fonctionne bien avec cela.
• Magazine, Blogger, Modèle de blogueur de mode - Une autre industrie toujours en vogue, le modèle Fashion Freaks est juste comme un look et une sensation haut de gamme qui crient classe, sophistication et luxe.
• Avocat, modèle de cabinet d'avocats - Autre créneau en vogue, les avocats et les cabinets d'avocats sont des clients lucratifs, qui exigent une présence capable de convertir des clients bien rémunérés. La présence professionnelle sur le Web peut être facilement adaptée à d'autres industries basées sur la pratique.
  Nous ne mentionnerons que brièvement le reste des modèles
  
• Modèle de portfolio de photographie
• Modèle DJ / Musicien / Groupe
• Modèle de restaurant / café
• Modèle de mise en page plein écran
• Création, modèle d'agence Web
• Modèle de livre électronique
• Modèle d'éducation ou d'université
• Modèle de voitures / automobile
• Modèle d'application mobile
• Modèle commercial général
• Modèle de construction
• Modèle à venir

Nous vous recommandons vivement de consulter les démos disponibles avec chacun de ces modèles, pour voir à quel point il est facile de commencer avec ces modèles.

Pages de contenu

Bien que les modèles de sites Web complets soient fantastiques, nous souhaitons parfois modifier ou créer des pages spécifiques. Pour cette raison, Beaver Builder a également de nombreuses pages de contenu qui ont été conçues et prêtes à l'emploi.

Voici quelques-unes des pages disponibles:

• À propos de nous (plusieurs versions)
• Nos services 
• Portfolio de photos
• Portfolio de conception
• Notre équipe (plusieurs versions)
• Contact (plusieurs versions)
• Tarifs (plusieurs versions)
• Blog (plusieurs versions)

Bien sûr, nous nous attendons à ce que ceux-ci augmentent avec le temps.

Les micropages proposent des sections d'une page ou des pages minimalistes si jamais vous en avez besoin.

Cliquez sur le lien ci-dessous pour accéder directement à la page des modèles. 

Validez votre panier Beaver Builder Gabarits

Beaver Builder vs Divi - Paramètres du générateur de page

Maintenant que vous avez une idée des modules et des modèles proposés par chaque constructeur de page, approfondissons un peu les paramètres.

Divi Builder Paramètres

La configuration de ce plugin est très simple.

Une fois que vous avez installé et activé le plugin, accédez à Options du plugin, et indiquez votre nom d'utilisateur et votre clé API dans la section «Mises à jour» pour recevoir des mises à jour automatiques.

Vous pouvez voir des paramètres supplémentaires ici, tels que les paramètres de l'API, l'intégration du type de poste et avancé.

Les paramètres de l'API contiennent des options pour l'intégration de Google Fonts et de Google Maps.

Sous Post Type Integration, vous pourrez activer ou désactiver Divi builder sur certains types de poste.

Sous l'onglet Avancé, vous pouvez trouver des options pour la minification, le générateur de fichiers CSS statiques, etc. et les options pour activer l'éditeur WordPress classique et le constructeur classique de back-end Divi.

L'élément le plus récent ici est la page «Générateur de thèmes».

Ici, vous pouvez trouver les modèles de générateur de thème que vous avez créés ou importés, ainsi que des options pour les importer et les exporter, afficher l'historique de modification du générateur de thème, etc. Nous aborderons cette nouvelle fonctionnalité plus en détail plus loin dans cet article.

Vous trouverez une liste de toutes les mises en page personnalisées dans le Bibliothèque Divi page. Il existe des boutons séparés pour gérer la catégorie de mise en page et pour importer ou exporter les mises en page. Aller à Éditeur de rôle Divi pour définir le niveau d'accès dont disposeront les différents rôles d'utilisateur.

Enfin, dans le centre de support, vous pouvez vérifier l'état de votre serveur système, essentiellement, il affiche des informations importantes sur votre serveur.

S'il y a des options qui ne sont pas réglées sur certaines valeurs recommandées, Divi vous en informera ici afin que vous puissiez les corriger.

C'est également là que vous pouvez configurer «l'accès à distance», permettant à l'équipe d'assistance d'Elegant Theme d'accéder directement à votre tableau de bord d'administration pour vous aider à corriger les erreurs que vous pourriez avoir.

Les autres éléments incluent le mode sans échec et la journalisation.

Beaver Builder Paramètres

Les options de paramétrage pour Beaver Builder se trouvent dans la page Paramètres > Page Builder. Fournissez votre clé de licence dans la section Licence pour activer les mises à jour automatiques du plugin.

Dans Modules, vous pouvez activer ou désactiver les modules. Les types de publication vous permettent de définir les types de publication pouvant être utilisés BeaverBuilder. Dans Modèles, vous pouvez décider quels modèles seront disponibles dans l'interface du constructeur de pages.

La section Icônes vous permet de décider quelles icônes doivent être disponibles dans l'interface.

Les options disponibles comprennent

• PoliceSuper,
• Fondation, et
• Dashicônes. 

Ceci est un exemple de la façon dont Beaver Builder vous permet de personnaliser et de bricoler toutes les options dont vous avez besoin. Si vous n'êtes pas satisfait de FontAwesome, choisissez quelque chose que vous aimez.

Vous trouverez également des sections séparées pour vider le cache, ce qui supprimera tout CSS et Javascript générés dynamiquement.

Enfin, vous trouverez une option pour désinstaller Beaver Builder. Ces fonctions suppriment toutes les données liées à BB de votre base de données WordPress - faites donc des sauvegardes avant de l'utiliser et assurez-vous de savoir ce que vous faites.

Lectures recommandées: https://www.collectiveray.com/beaver-builder-vs-elementor

Beaver Builder vs Divi - Fonctionnalités supplémentaires

Quels autres avantages ces constructeurs de pages offrent-ils ?

Divi Theme

Le plugin de Elegant Themes est livré avec plusieurs autres fonctionnalités intéressantes. Par exemple, la bibliothèque PageBuilder vous permet d'enregistrer des modules et des mises en page personnalisés afin que vous puissiez les réutiliser à l'avenir.

De plus, il est également possible d'importer ou d'exporter ces éléments vers et depuis d'autres sites Web.

Les options d'espacement de mise en page supérieures exigent également une mention spéciale. Ces options facilitent grandement l'application de l'espacement exact souhaité entre les lignes, les éléments et les sections.

Vous trouverez des options dédiées pour définir la marge, le remplissage, l'espacement vertical et horizontal. Il est également possible de paramétrer la largeur des lignes et des colonnes.

Dans certains cas, vous devrez peut-être utiliser le même module à plusieurs endroits. Vous pouvez facilement copier et coller n'importe quel module, ligne ou colonne dans d'autres publications ou pages.

De plus, vous pouvez les marquer comme éléments globaux.

Cela vous permet d'apporter des modifications à un seul élément global, et les modifications seront automatiquement appliquées aux autres endroits également. 

Générateur de thèmes Divi

L'une des plus grandes mises à jour Elegant Themes sorti pour Divi ces dernières années est le Theme Builder.

Cette fonctionnalité vous permet de créer, concevoir et personnaliser l'intégralité de votre site Web. Ce n'est plus seulement un constructeur de page, c'est un constructeur de thème complet.

Vous pouvez créer des en-têtes et des pieds de page personnalisés globaux ou en définir un pour des zones individuelles de votre site.

Vous pouvez également définir des modèles de corps personnalisés qui vous permettent de créer des modèles de produits personnalisés, des modèles d'articles de blog, 404 pages, des pages de résultats de recherche ainsi que des pages d'archives personnalisées telles que des pages de catégories personnalisées, des pages d'auteur personnalisées, etc.

Le générateur de thème étend la puissance du générateur de page à l'ensemble de votre site Web.

Lors de la création d'un nouveau modèle, vous avez accès à tous les outils et fonctionnalités du générateur de page, vous permettant de le créer et de le concevoir comme vous le souhaitez.

Cela signifie que vous pouvez créer des conceptions personnalisées pour les en-têtes et les pieds de page si vous le souhaitez. Pour compléter cela, le module de menu est livré avec des améliorations telles que des options de mise en page supplémentaires et un contrôle total de la conception pour vous aider à créer de beaux en-têtes et pieds de page avec un menu personnalisé.

Les nouveaux modèles de corps personnalisés vous permettent de modifier tous vos articles, produits ou la conception et la structure de vos pages à la fois.

Avant cela, vous deviez accéder à chaque article, produit ou page et les modifier à l'aide du générateur de page pour apporter des modifications. Il ne vous reste plus qu'à définir un modèle, à l'appliquer aux zones appropriées de votre site et vous avez terminé.

Vous pouvez même utiliser les modules WooCommerce pour créer des modèles de produits personnalisés pour votre boutique en ligne. Il existe également des modules de contenu dynamique équipés d'une boucle de publication mise à jour et d'options de filtrage que vous pouvez utiliser pour créer des pages d'archives personnalisées.

Bien sûr, vous disposez également de tous les moyens de contrôler où et comment votre modèle sera appliqué. Vous pouvez facilement inclure ou exclure certains éléments d'un modèle via des cases à cocher, comme on peut le voir ci-dessous:

Depuis la version 4.0, Divi n'est plus un constructeur de pages, c'est un constructeur de thèmes.

Bénéficiez de 10% de réduction sur Divi jusqu'en avril 2024

PS. L'offre ci-dessus est uniquement disponible via le lien ci-dessus à partir de CollectiveRay

Beaver Builder

D'autre part, Beaver Builder a aussi quelques tours dans ses manches.

Tout d'abord, l'édition frontale en direct est impressionnante. Il offre une expérience intuitive où vous pouvez modifier la page et obtenir le résultat exact sans aucune conjecture.

Il vous permet également d'utiliser les widgets WordPress par défaut et les widgets personnalisés dans vos mises en page.

Le mode éditeur sera pratique lors de la livraison d'un projet au client. Ce mode vous permet de limiter les capacités du client pour vous assurer qu'il n'effectue aucune modification indésirable dans la mise en page principale.

Une autre caractéristique importante de Beaver Builder est que le contenu de la page reste intact même après la désactivation du plugin.

Vous perdrez les styles, mais la page affichera toujours le contenu. En revanche, la plupart des autres constructeurs de pages vous laisseront avec un désordre de codes courts lorsque vous désactivez ce plugin.

Rendez-vous sur BeaverBuilder site

Beaver Builder vs Divi - Avantages et inconvénients

Chaque produit, aussi bien conçu ou mature qu'il soit, aura des forces et des faiblesses. Ces deux constructeurs de pages ne sont pas différents.

Divi Theme

Avantages

1. Une solution très puissante pour créer tout type de mise en page,
2. De nouvelles mises à jour de performances rendent Divi plus rapide que jamais,
3. Prix ​​attractifs avec accès à de nombreux autres thèmes et plugins WordPress - l'acheter est une évidence, un excellent rapport qualité-prix
4. De nombreux designs fantastiques, avec de nombreuses options de personnalisation,
5. Générateur de thèmes puissant,
6. Une documentation complète et un support performant et réactif

Inconvénients

1. Prenez le temps de vous y habituer
2. L'éditeur frontal prend un certain temps à charger et l'ajout de modules aux pages est beaucoup plus lent que Beaver Builder
3. Vous êtes limité aux modules disponibles et développés par ET (bien que la version 3.1 prenne désormais en charge une API de développeur, ce qui signifie que les développeurs commenceront à y intégrer leurs plugins)
4. Impossible de supprimer les données qu'il ajoute à la base de données, ce qui rend difficile de s'éloigner du thème Divi

Beaver Builder

Avantages

1. Une interface utilisateur simple,
2. Le contenu reste intact même après la désactivation du plugin,
3. Mode éditeur unique pour les clients,
4. Il vous permet d'utiliser des widgets WordPress dans les mises en page.
5. Interface utilisateur rapide, dynamique et réactive avec une interface facile à comprendre
6. Grand choix de modèles professionnels pour vous aider à démarrer votre conception
7. Prend en charge les widgets natifs de WordPress pour que vous puissiez utiliser n'importe quoi

Inconvénients

1. Plus cher que les autres constructeurs de pages WordPress

Divi contre Beaver Builder - Tarification

Les deux Beaver Builder et Divi sont compatibles GPL, ce qui signifie que vous pouvez les utiliser sur autant de sites que vous le souhaitez. produits afin que vous puissiez les utiliser sur autant de sites Web que vous le souhaitez.

Vous pouvez opter pour trois plans différents avec Beaver Builder à partir de 99 $ jusqu'à 546 $. Chaque plan vous donne un accès complet au Beaver Builder plugin et tous les modules et modèles, les niveaux supérieurs vous offrant des fonctionnalités plus avancées telles que Multisite, White labeling et Themer.

Avec Divi, vous n'avez que deux options, par an, à un prix standard de 89 $ qui nécessite un achat annuel, ou l'option à vie à 249 $. Les deux ont exactement le même accès, mais bien sûr, vous perdez l'accès au support et aux mises à niveau une fois l'année passée.

Jetons un coup d'œil plus détaillé. 

Divi Builder

Vous devez être un Elegant Themes membre d'utiliser leurs plugins - et l'accès se fait aux tarifs ci-dessous. 

Deux forfaits sont disponibles : accès annuel et accès à vie.

Le plan d'accès annuel est au prix de 89 $ par an. L'accès à vie vous permet de profiter de tous ces avantages pour un paiement unique de 249 $.

Heureusement, il y a une EXCLUSIVITÉ à CollectiveRay Offre de 10 % de réduction en cours en ce moment alors faites-vous une bonne affaire aujourd'hui. Tant que vous y êtes, autant obtenir l'accès à vie compte tenu de cette réduction limitée dans le temps!

Les deux plans offrent un accès illimité à tous les thèmes et plugins développés par ElegantThemes.

Vous bénéficierez également de mises à jour rapides, d'un support premium et d'une garantie de remboursement de 30 jours.

Obtenez 10 % de réduction sur Divi jusqu'en avril 2024

Beaver Builder

Beaver Builder propose quatre plans tarifaires. Le plan Standard est au prix de 99 $, ce qui vous permet d'utiliser le plug-in sur un site Web, vous offre un an d'assistance et l'accès à des modules et modèles premium.

Pro est au prix de 199 $, qui comprend tous les avantages du plan standard, plus le thème et la compatibilité multisite.

L'agence est au prix de 399 $ et bénéficie de toutes les fonctionnalités de Pro ainsi que d'une autorisation complète d'étiquetage blanc.

Ultimate coûte 546 $ par an et ajoute Assistant Pro, une option de stockage basée sur le cloud pour les conceptions et les actifs.

Buy BeaverBuilder Maintenant

Beaver Builder vs Divi - Foire Aux Questions

Is Beaver Builder plus rapide que Divi ?

Beaver Builder n'est plus plus rapide que Divi. Il permet de charger l'éditeur plus rapidement et est plus rapide à utiliser et à apprendre. Cependant, une nouvelle mise à jour des performances de Divi a transformé son fonctionnement. C'est maintenant l'un des thèmes WordPress les plus rapides que vous puissiez acheter.

Quel est le meilleur - Divi ou Elementor?

Divi est meilleur que Elementor pour certaines choses tandis qu'Elementor est plus fort dans d'autres. Divi est meilleur pour l'accès aux plugins et aux fonctionnalités, à son plan d'agence et à la puissance du constructeur de pages. Elementor est meilleur pour être gratuit, avec des options premium et très facile à maîtriser.

Elementor est-il le meilleur constructeur de pages?

Elementor le meilleur constructeur de page si vous voulez un constructeur de page accessible gratuitement. Si vous recherchez un constructeur puissant et autonome pour créer un ou deux sites Web, vous ne pouvez tout simplement pas faire mieux qu'Elementor. C'est rapide, gratuit et facile à utiliser. De quoi pourriez-vous avoir besoin de plus?

Is Beaver Builder bon pour le référencement ?

Oui, Beaver Builder possède toutes les fonctionnalités nécessaires pour contrôler l'optimisation de votre site Web pour les moteurs de recherche, y compris la rapidité, le contrôle des en-têtes et des balises de titre et d'autres fonctionnalités nécessaires. 

Quel constructeur de pages choisir ?

Nous arrivons maintenant à la partie (difficile) où nous devons choisir entre ces constructeurs de pages.

Comme vous l'avez remarqué, les deux plugins offrent un excellent rapport qualité-prix. Ils offrent une excellente interface utilisateur et vous permettent de créer beaucoup plus facilement des mises en page personnalisées.

Comme les deux plugins ont leurs cas d'utilisation, vous devez savoir lequel répond le plus à vos besoins. Laisse moi t'aider avec ça -

• Selectionnez Divi si vous voulez un contrôle complet sur la mise en page. Une fois que vous vous êtes habitué aux options disponibles, c'est un outil très puissant vous permettant de créer n'importe quel type de mise en page que vous souhaitez.
  Résultat final: 5 sur 5.
• Aller avec Beaver Builder si vous souhaitez vous lancer rapidement. Comme ce constructeur de pages n'utilise aucun code court, vous pouvez facilement supprimer le design actuel et en essayer un nouveau en quelques clics de souris.
   Résultat final: 4.5 sur 5

Si vous recherchez d'autres options, vous voudrez peut-être également vérifier Visual Composer or Elementor Pro, que nous avons tous deux traités séparément sur ce site. Elementor et Visual Composer sont tous deux des acteurs majeurs dans le créneau du constructeur de pages.

Mots finaux: Beaver Builder contre Divi

Divi et Beaver Builder sont deux des plugins de création de pages les plus populaires en ce moment. ONUless vous avez beaucoup utilisé les deux plugins, il est vraiment difficile de choisir l'un plutôt que l'autre. Cet article de comparaison devrait vous aider à prendre cette décision.

Nous pensons que Elegant Themes vous donne plus de valeur dans l'ensemble, étant donné que vous avez accès à une tonne de thèmes et de plugins WordPress, mais BB est également un excellent choix. De plus, cette nouvelle mise à niveau des performances qu'ils ont introduite a véritablement changé la donne. C'est vraiment difficile de choisir Beaver Builder sur Divi maintenant.

Bénéficiez de 10% de réduction sur Divi jusqu'en avril 2024

Buy BeaverBuilder Maintenant

Alors, lequel avez-vous choisi? Faites-nous savoir dans les commentaires ci-dessous. 

À propos de l’auteur

Auteur : David AttarSite Web : https://www.linkedin.com/in/dattard/Courriel : David@collectiveray.com

David travaille dans ou autour de l'industrie en ligne et numérique depuis 21 ans. Il possède une vaste expérience dans les secteurs des logiciels et de la conception Web utilisant WordPress, Joomla et les niches qui les entourent. Il a travaillé avec des agences de développement de logiciels, des éditeurs de logiciels internationaux, des agences de marketing locales et est désormais responsable des opérations marketing chez Aphex Media, une agence de référencement. En tant que consultant numérique, son objectif est d'aider les entreprises à obtenir un avantage concurrentiel en utilisant une combinaison de leur site Web et des plateformes numériques disponibles aujourd'hui. Son mélange d'expertise technologique combiné à un fort sens des affaires confère un avantage concurrentiel à ses écrits.