Divi contre Avada 2022

Divi et Avada sont largement considérés comme deux des meilleurs thèmes WordPress du marché.

Ces deux thèmes WordPress "tout en un" polyvalents disposent d'un générateur de pages par glisser-déposer convivial et sont livrés avec de superbes mises en page de sites Web prédéfinies. Cela vous permet de créer n'importe quel type de site Web en un clic.

Elegant Themes a lancé Divi en 2013. Ce n'était pas le premier thème WordPress "tout en un" sur le marché, mais c'était le premier design tout-en-un qui a tout bien fait et il a encouragé d'autres développeurs de thèmes à intensifier leur jeu.

Au cours des dernières années, Elegant Themes a continuellement affiné et amélioré Divi, plaçant son constructeur de pages phare Divi Builder au cœur du thème.

Divi est sans aucun doute l'un des meilleurs thèmes WordPress, mais il existe des alternatives que les utilisateurs de WordPress devraient envisager, telles que X Theme et le Genesis Framework.

Dans cette revue, je voudrais vous montrer comment Divi se compare à Avada.

Avada est sorti en 2012 par Theme Fusion, un an avant le lancement de Divi.

Avec environ 600 000 ventes, il s'agit de loin du thème WordPress le plus vendu sur ThemeForest, dépassant trois fois le thème X classé deuxième.

Après quelques minutes d'utilisation d'Avada, on comprend pourquoi le thème WordPress est si populaire. C'est une solution polyvalente et son constructeur de page intégré, Fusion Builder Live, est excellent.

Examinons de près ce que Divi et Avada peuvent faire et voyons comment ils se comparent.

Rubriques d'articles :

• Facilité d'installation
• Création de pages back-end
• Création de pages frontales
• Contenu et mises en page
• Autres fonctionnalités et paramètres
• Performance
• Assistance et documentation
• Coût
• Dernières pensées

Facilité d'installation

Les thèmes WordPress tout-en-un sont conçus pour que n'importe qui puisse les utiliser, quelle que soit son expérience technique.

Cependant, les débutants peuvent avoir besoin d'un peu d'aide supplémentaire, en particulier lors de la première configuration.

Divi – Facilité de configuration

Si vous êtes nouveau sur Divi, vous pouvez être un peu confus quant à ce à quoi « Divi » fait référence car les thèmes élégants utilisent fréquemment le mot pour décrire le thème, le constructeur de page et le package global.

Pour éviter toute confusion, le thème WordPress est parfois appelé Divi Theme pour le distinguer du constructeur de pages Divi Builder.

Pour activer Divi Theme sur votre site Web, il vous suffit de télécharger les fichiers dans votre dossier de thèmes WordPress et d'activer le design à partir de la page des thèmes WordPress.

Divi Theme ne vous redirige pas vers une autre page après l'activation, cependant vous verrez maintenant un menu d'administration pour Divi en bas du menu d'administration de WordPress.

Le menu renvoie aux principales zones de configuration : options de thème, générateur de thème, personnalisateur de thème, éditeur de rôle, bibliothèque Divi et centre de support.

Le Divi Builder est intégré directement dans Divi Theme, mais il est également disponible en tant que plugin WordPress autonome pour ceux qui souhaitent utiliser Divi Builder avec d'autres thèmes WordPress.

Le menu d'administration du Divi Builder autonome est quasiment identique. Il manque juste un lien vers WordPress Customizer et la page d'options de thème est remplacée par une page d'options de plugin avec moins d'options.

Si le plugin Divi Builder WordPress est utilisé sur votre site web et que vous activez Divi Theme, le plugin Divi Builder WordPress sera automatiquement désactivé.

Pour activer les mises à jour automatiques des thèmes pour Divi, accédez à la page des mises à jour dans la zone Options Divi et entrez votre nom d'utilisateur et votre clé API Elegant Themes.

Les thèmes WordPress tout-en-un tels que Divi et Avada ont tendance à utiliser plus de ressources que d'autres conceptions pour s'assurer que certaines fonctionnalités fonctionnent correctement.

Si votre configuration d'hébergement n'est pas configurée correctement, vous pouvez constater que le processus d'importation de mises en page prédéfinies est lent.

Il est donc prudent de consulter le Divi Support Center après activation pour vérifier l'état de votre configuration.

Cette page dispose également d'un mode sans échec et d'un journal des erreurs.

Avada - Facilité d'installation

Avada a adopté une approche plus adaptée aux débutants pour son thème WordPress.

Une fois que vous avez téléchargé Avada dans votre dossier de thèmes WordPress et activé le design, vous serez redirigé vers la page d'accueil d'Avada.

La page d'accueil affiche une vidéo d'introduction sur la dernière version d'Avada et vous rappelle d'enregistrer votre achat.

Il est également conseillé d'activer deux plugins WordPress : Fusion Core et Fusion Builder.

Toutes les pages que vous voyez dans le menu de navigation de la page d'accueil se trouvent dans le menu d'administration d'Avada.

Malheureusement, plutôt que d'être positionné autour du menu "Apparence", Avada place son menu juste en haut de votre menu d'administration sous la page d'administration du tableau de bord WordPress. Cela pousse les liens importants pour les fonctionnalités clés de WordPress telles que les publications, les médias et les pages plus loin dans votre menu d'administration WordPress.

Vous pouvez utiliser le plugin gratuit WordPress Admin Menu Editor pour mieux organiser votre menu d'administration WordPress si cela vous frustre.

Pour recevoir les mises à jour de thèmes et de plugins et accéder à la gamme de démos de thèmes d'Avada, vous devez enregistrer votre achat via une clé de jeton.

Fusion Core et Fusion Builder doivent être activés pour qu'Avada fonctionne correctement. Vous pouvez le faire via la page des plugins WordPress.

Le plug-in Fusion White Label Branding d'Avada est également disponible ici, ainsi que quatre plug-ins premium et une sélection de plug-ins gratuits recommandés.

Une fois Fusion Builder activé, vous verrez le menu d'administration de Fusion Builder sous le menu d'administration d'Avada.

Le menu d'administration de Fusion Slider s'affiche en dessous, et il existe des menus pour les types de publications personnalisées de portefeuille et de FAQ.

Comme Divi, Avada nécessite une bonne configuration d'hébergement pour fonctionner efficacement.

La page d'état du système peut vous aider à détecter les problèmes liés à la configuration de votre hébergement. Il affiche des informations sur votre installation WordPress et votre environnement de serveur, et vous permet de générer un rapport système.

Bien qu'Avada propose plus de menus et d'informations aux utilisateurs, je pense que les développeurs ont fait un meilleur travail en facilitant l'accès des débutants à WordPress à leur thème en redirigeant les utilisateurs vers une page d'accueil.

Conclusion - Facilité d'installation

Ni Divi ni Avada ne sont difficiles à configurer, mais Avada aide davantage les débutants en redirigeant les nouveaux utilisateurs vers une page d'accueil informative.

Divi a moins de paramètres à modifier et place la plupart des options de configuration dans un seul domaine, mais aucune aide n'est donnée aux débutants après l'activation de Divi.

Vainqueur : Avada

Création de pages back-end

Au cœur de Divi et d'Avada, vous trouverez deux des meilleurs constructeurs de pages par glisser-déposer du marché : Divi Builder et Fusion Builder.

Les deux solutions simplifient la tâche de créer de superbes conceptions de sites Web et offrent des éditeurs backend et frontend.

Divi – Création de pages back-end

Une fois Divi Builder activé, vous verrez un bouton « Utiliser le Divi Builder » en haut de l'éditeur WordPress. Cela fait référence à l'éditeur Visual Builder frontal de Divi Builder.

Vous verrez alors une option pour modifier votre mise en page à l'aide de Divi Builder.

Si vous êtes connecté, vous pouvez également lancer le Divi Builder Visual Builder sur le frontend de votre site web depuis la barre d'administration de WordPress.

Par défaut, Divi est activé pour tous les articles, pages et types de publication personnalisés. Si, pour une raison quelconque, Divi Builder ne s'affiche pas, vérifiez la zone des options Divi pour vous assurer que Divi est activé pour ce type de publication.

L'un des ajouts les plus intéressants à Divi est le Divi Layout Block. Ce bloc permet d'insérer des layouts Divi directement dans l'éditeur de blocs WordPress.

C'est une fonctionnalité intéressante si vous souhaitez utiliser Divi, mais avec l'éditeur de blocs WordPress comme principal moyen de créer des mises en page.

Dans le passé, Divi Builder était un éditeur de création de page backend. Cet éditeur, désormais appelé Legacy Builder, est toujours disponible au sein de Divi Builder.

Si le thème Divi est activé, vous pouvez activer le Legacy Builder en accédant à la section constructeur dans la zone des options du thème et en cliquant sur l'onglet avancé.

Vous pouvez ensuite désactiver l'option d'expérience de création la plus récente et activer l'éditeur classique.

Si vous utilisez le plugin WordPress autonome Divi Builder, ces options se trouvent dans l'onglet avancé de la page des options du plugin.

Le Legacy Builder a une apparence et une convivialité similaires au mode d'affichage filaire disponible dans le Visual Builder.

En tant qu'éditeur backend, vous ne pouvez pas voir les modifications que vous apportez à votre mise en page en temps réel. Cependant, cela vous aide à créer plus rapidement la structure de votre page, car il y a moins de distractions.

La partie supérieure de l'éditeur affiche les paramètres généraux et les paramètres d'importation et d'exportation. En dessous se trouvent des options pour enregistrer dans la bibliothèque, charger une mise en page et effacer la mise en page. Il existe également des boutons pour annuler les modifications, rétablir les modifications et afficher votre historique d'édition.

Je pense qu'Elegant Themes a fait ce qu'il fallait en faisant de Visual Builder l'éditeur par défaut de Divi Builder, cependant l'éditeur backend est toujours capable de créer de belles mises en page et il est facile de comprendre pourquoi certains propriétaires de sites Web préfèrent encore cette interface.

Avada – Création de pages back-end

Tournons notre attention vers Fusion Builder.

Fusion Builder Live est le principal moyen de créer et de modifier des mises en page dans Avada, mais je voudrais d'abord vous montrer comment fonctionne l'éditeur principal et comment Fusion Builder fonctionne avec l'éditeur de blocs WordPress.

Une fois le plugin activé, vous verrez des boutons pour Fusion Builder et Fusion Builder Live dans l'éditeur WordPress.

Les développeurs de Fusion Builder prévoient d'améliorer l'intégration avec l'éditeur de blocs WordPress, mais pour le moment, l'activation de Fusion Builder fera de l'éditeur classique l'expérience d'édition par défaut.

Dans la page des paramètres de Fusion Builder, vous pouvez charger automatiquement l'éditeur principal de Fusion Builder en activant "Fusion Builder Auto Activation".

Lors de la création d'une nouvelle publication ou d'une nouvelle page dans Fusion Builder, il vous sera demandé si vous souhaitez ajouter un conteneur ou une page prédéfinie.

En haut de Fusion Builder, vous pouvez basculer entre le générateur et la bibliothèque Fusion Builder. La bibliothèque contient des démonstrations complètes de thèmes de sites Web et des modèles, conteneurs, colonnes et éléments (modules) enregistrés.

Cette zone vous permet également de modifier le CSS, d'enregistrer votre mise en page, de supprimer votre mise en page et d'afficher votre historique d'édition.

D'un point de vue fonctionnel, l'éditeur backend Fusion Builder a beaucoup en commun avec Legacy Builder dans Divi, mais son jeu de couleurs gris terne donne à l'interface un aspect un peu daté.

Fusion Builder Live peut être lancé sur le frontend de votre site Web à partir de la barre d'outils WordPress. Vous pouvez également revenir à votre éditeur principal préféré en sélectionnant "Modifier la page".

Bien qu'il n'y ait pas d'intégration directe avec l'éditeur de blocs WordPress, lorsque vous ajoutez ou modifiez du contenu, vous pouvez choisir d'utiliser Fusion Builder, Fusion Builder Live ou l'éditeur de blocs WordPress (Gutenberg).

Il n'y a tout simplement aucun moyen de passer directement à l'éditeur de blocs lorsque vous utilisez l'éditeur classique ou l'éditeur Fusion Builder.

Que vous utilisiez l'éditeur classique WordPress, l'éditeur de blocs WordPress ou Fusion Builder, si vous créez du contenu dans le backend de WordPress, vous verrez la boîte Options de page Fusion.

Ces paramètres vous permettent de personnaliser chaque publication, page ou type de publication personnalisé sur votre site Web. Tout ce que vous définissez ici remplacera les paramètres de la page principale des options du thème Avada.

Des dizaines de paramètres sont disponibles ici pour votre en-tête, votre mise en page, votre zone de contenu, etc.

Comme Divi Builder, Fusion Builder est activé par défaut pour tous les articles, pages et types de publication personnalisés. Vous pouvez vérifier quels types de publication sont activés dans la page des paramètres de Fusion Builder.

Comme vous pouvez le voir, d'un point de vue fonctionnel, Fusion Builder vous offre autant d'options de conception que Divi Builder dans le backend de votre site Web.

Conclusion - Création de pages backend

Même si vous modifiez la plupart de votre contenu et de vos mises en page sur le frontend de votre site Web, je vous encourage à vous familiariser avec le fonctionnement de chaque éditeur backend, car cela vous permettra d'apporter des modifications rapides aux mises en page enregistrées.

Vous devez également comprendre comment lancer Divi Visual Builder et Fusion Builder Live depuis le backend de votre site Web.

Sans aucun doute, Divi Builder a été mieux implémenté dans la zone d'administration de WordPress. Il a un excellent support pour l'éditeur de blocs WordPress et le backend Legacy Builder est plus coloré.

En revanche, Avada continue de désactiver l'éditeur de blocs WordPress et fait de l'éditeur classique obsolète l'éditeur par défaut.

Vainqueur : Divi

Création de pages frontales

Vous n'avez pas acheté Divi ou Avada pour créer des mises en page sur le backend de votre site Web, n'est-ce pas ?

Si vous souhaitez profiter pleinement de ces thèmes WordPress avancés, vous devez utiliser leur éditeur frontal intégré.

Divi – Création de page d'accueil

Pour le distinguer de l'éditeur backend Legacy Builder, l'éditeur frontal de Divi Builder s'appelle Visual Builder, mais la plupart des gens l'appellent simplement Divi Builder car il s'agit de l'expérience d'édition par défaut.

Si vous éditez une page qui a déjà du contenu, Divi Builder se lancera entièrement, vous permettant de modifier la mise en page.

Si la page est vierge, Divi Builder vous présentera trois options. Vous pouvez choisir de créer une mise en page à partir de rien, de sélectionner une mise en page prédéfinie ou de cloner une page existante.

Je recommande aux débutants de sélectionner une mise en page prédéfinie, car elle vous permet de voir ce que Divi Builder peut faire et d'apprendre comment fonctionne l'interface.

Le menu Divi Builder s'affiche en bas de page et est divisé en trois sections.

Lorsque vous survolez n'importe quelle partie de la mise en page, vous verrez un aperçu de l'élément ainsi que des boutons permettant de modifier les paramètres, le style, la position, etc.

Une mise en page est construite à l'aide de nombreuses sections. Les sections peuvent contenir de nombreuses lignes, les lignes peuvent contenir de nombreuses colonnes et les colonnes peuvent contenir de nombreux modules.

Lorsque vous survolez l'un de ces éléments sur votre page, vous verrez apparaître une boîte avec des options pour le déplacer, modifier ses paramètres, le dupliquer, l'enregistrer dans la bibliothèque, le supprimer, etc.

Le processus de modification de n'importe quel aspect de votre conception, qu'il s'agisse d'une section, d'une ligne, d'une colonne ou d'un module, est le même.

Le menu Divi Builder est une grande partie de l'expérience de création de pages.

Si vous appuyez sur le gros X au milieu du menu Divi Builder, le menu disparaîtra. Seul un bouton avec trois points reste pour que vous puissiez recharger le menu.

Sur le côté gauche du menu, il y a des boutons pour effectuer un zoom avant et arrière sur votre conception et l'afficher en mode bureau, tablette et smartphone. Divi Builder est une solution réactive qui a été développée pour tous les appareils, mais il est toujours utile de voir comment les visiteurs mobiles verront vos mises en page.

Le menu des paramètres de Divi Builder est également disponible à partir d'ici.

À partir de cette boîte de paramètres, vous pouvez activer le mode survol, le mode clic et le mode grille. Ces modes modifient la façon dont vous interagissez avec le Visual Builder.

De nombreux autres paramètres peuvent être activés et désactivés ici, tels que le mode d'affichage par défaut, le flux de création de page et les animations de l'interface du générateur.

Sur la gauche, vous trouverez également "Wireframe View".

C'est l'une de mes fonctionnalités préférées de Divi Builder car elle vous permet de supprimer tous les éléments visuels de votre mise en page et de voir la structure de votre page.

Cela rend la tâche de déplacer les modules et les rangées beaucoup plus simple car tout est moins encombré.

Au centre du menu Divi Builder, il y a des boutons pour charger depuis la bibliothèque, enregistrer dans la bibliothèque et effacer la mise en page (je parlerai plus en détail des mises en page plus tard).

À droite se trouve une option pour charger la boîte de paramètres de la page. Cette boîte peut être déplacée sur votre page ou ajustée à la taille de votre page.

Il existe des options pour modifier le titre de votre page, l'image en vedette et les couleurs d'arrière-plan. Une fonctionnalité de test fractionné est également disponible.

Des dizaines d'options de style sont disponibles dans les onglets de conception et avancés. Les boutons Annuler et Rétablir sont également intégrés dans cette zone afin que vous puissiez annuler toutes les modifications que vous apportez.

Vous pouvez afficher toutes les modifications que vous avez apportées dans la boîte d'historique des modifications et revenir à n'importe quel état précédent.

La dernière option du menu du milieu est la portabilité.

La boîte de portabilité vous permet d'exporter et d'importer vos mises en page en utilisant le format de fichier JSON.

Ceci est utile pour effectuer des sauvegardes de mise en page et pour transférer des mises en page Divi Builder vers d'autres sites Web.

Les mises en page peuvent être enregistrées à tout moment à l'aide du bouton d'enregistrement situé à droite du menu Divi.

La zone comporte également des boutons pour la recherche, les calques et l'aide.

L'outil de recherche peut être utilisé pour trouver toutes les fonctionnalités et fonctionnalités de Divi Builder. Des didacticiels utiles sont également répertoriés ici, mais vous trouverez également des didacticiels vidéo et des raccourcis clavier utiles via le bouton d'aide.

Layers est un nouvel outil qui vous aide à voir toutes les sections de mise en page. C'est un moyen rapide de vérifier la structure de votre page et cela vous permet de modifier les paramètres de la section.

Avada - Création de page d'accueil

L'éditeur frontal d'Avada s'appelle Fusion Builder Live.

Ce constructeur de pages a été conçu spécifiquement pour Avada et n'est pas disponible en téléchargement séparément, ce qui est décevant car il s'agit de l'un des meilleurs constructeurs de pages WordPress sur le marché.

Au lieu d'intégrer des options de conception de site Web dans WordPress Customizer, Theme Fusion a créé un personnalisateur de thème directement dans Fusion Builder Live. Cela signifie que vous pouvez modifier n'importe quoi via l'éditeur, qu'il s'agisse d'un article ou d'une page ou de la conception de l'en-tête, du pied de page, des barres latérales ou du logo de votre site Web.

Le menu principal de Fusion Builder Live se trouve en haut de chaque page, les paramètres étant affichés dans une barre latérale sur le côté gauche de la page. Le premier bouton du menu principal masque cette barre latérale pour vous permettre de voir votre mise en page dans son intégralité.

Comme Divi Builder, il vous suffit de survoler une partie de votre page pour faire une personnalisation ou la déplacer ailleurs.

Lorsque la barre latérale est affichée, votre mise en page sera réduite dans la zone de canevas principale, mais comme les options sont affichées sur le côté gauche de la page au lieu d'être dans une boîte de paramètres contextuelle, elle semble moins encombrée.

Si vous préférez, vous pouvez afficher les paramètres des éléments dans une boîte à icônes mobile (dans Divi, les éléments sont appelés modules).

Il vous suffit de changer le mode d'édition des éléments de 'élément' à 'dialogue' dans la boîte de préférences.

Le deuxième bouton du menu supérieur charge la bibliothèque Fusion Builder et à côté se trouve une option pour afficher toutes les modifications que vous avez apportées à votre page.

Le bouton suivant charge la boîte de préférences de Fusion Builder Live.

Il y a une douzaine de paramètres ici qui modifient le fonctionnement de l'éditeur. C'est ici que vous pouvez déplacer les paramètres des éléments de la barre latérale vers la zone de canevas principale.

Vous pouvez également déplacer la barre latérale principale vers le côté droit de la page à partir de cette boîte et désactiver l'en-tête collant et l'en-tête transparent.

Si vous cliquez sur le bouton + dans le menu, vous pouvez créer de nouveaux messages, pages et autres types de messages personnalisés, tandis que le bouton de la corbeille vous permet d'effacer votre mise en page.

Plusieurs options utiles se trouvent sur le côté droit du menu principal.

Le premier bouton est pour le support. En cliquant dessus, vous découvrirez des liens vers un guide de démarrage et le centre de support Theme Fusion. Des raccourcis clavier utiles sont également affichés ici.

Le bouton suivant est pour la réactivité. Cela affichera votre mise en page en mode bureau et les modes paysage et portrait pour les tablettes et les smartphones.

Fusion Builder Live dispose également d'un mode d'affichage filaire qui affiche votre mise en page à l'aide de l'éditeur principal.

À mon avis, le mode d'affichage filaire dans Divi Builder est meilleur car il est plus coloré et plus facile à utiliser.

Les derniers boutons vous permettent de prévisualiser, publier et enregistrer votre mise en page.

À première vue, il semble que le bouton d'aperçu masque simplement la barre latérale des options, mais cette fonctionnalité désactive également l'édition afin que les contours et les boutons de paramètres n'apparaissent pas.

La façon dont Theme Fusion a intégré les paramètres clés dans l'éditeur Fusion Builder Live est fantastique.

La barre latérale des paramètres répertorie des centaines de paramètres de mise en page du thème. Il fonctionne de la même manière que WordPress Customizer.

Ces mêmes options peuvent également être trouvées dans la page principale des options du thème Avada, mais en modifiant les choses dans l'éditeur en direct, vous pouvez voir les modifications que vous apportez en temps réel.

Vous souvenez-vous de la boîte Fusion Page Options qui s'affichait sous les publications et les pages dans la zone d'administration de WordPress ?

Ces mêmes options se trouvent dans la barre latérale des paramètres de Fusion Builder Live. Ils peuvent être utilisés pour apporter des modifications spécifiques à votre page et à sa mise en page.

Dans l'ensemble, Fusion Builder Live est une solution fantastique et son interface est facile à apprendre. C'est dommage qu'il ne soit pas vendu séparément.

Conclusion - Création d'une page d'accueil

Divi Builder et Fusion Builder Live offrent tous deux une expérience d'édition fantastique et vous permettent de créer facilement de belles mises en page.

Lorsqu'il s'agit de créer des mises en page et des pages de style, Divi Builder est la solution la plus raffinée.

Il offre beaucoup plus d'options de style pour les modules, les colonnes, les lignes et les sections. D'autres fonctionnalités, telles que le mode d'affichage filaire, ont également été mieux implémentées.

Assurez-vous de consulter notre examen complet de Divi Builder pour un aperçu plus complet de ce qu'il peut faire.

Vainqueur : Divi

Contenu et mises en page

Divi et Avada sont tous deux livrés avec de superbes conceptions et mises en page de sites Web prédéfinies qui peuvent être importées dans votre site Web en un clic.

Ils vous permettent également de personnaliser l'en-tête, le pied de page, les barres latérales de votre site Web, etc.

Divi – Contenu et mises en page

Plus de 1 100 mises en page sont disponibles dans Divi Builder et nombre d'entre elles sont regroupées pour former un pack de mise en page de site Web.

Les thèmes élégants ajoutent de nouvelles mises en page à Divi chaque semaine et il existe un nombre croissant de sites Web et de marchés tiers qui proposent des mises en page Divi prédéfinies.

Comme indiqué précédemment, lorsque vous lancez Divi sur une page vierge, il existe une option pour sélectionner une mise en page prédéfinie.

Vous pouvez également charger la bibliothèque Divi depuis le menu principal de Divi Builder.

La bibliothèque Divi contient toutes les mises en page prédéfinies et personnalisées que vous avez enregistrées. Les pages que vous avez créées avec Divi Builder sont également accessibles ici.

Les mises en page sont attribuées à l'une des douze catégories, mais vous pouvez également trouver des mises en page appropriées via le champ de recherche.

Plus de 150 packs de mise en page de sites Web sont disponibles dans Divi.

Ces packs contiennent des mises en page pour de nombreuses zones différentes de votre site Web, telles que votre page d'accueil, votre index de blog, votre boutique en ligne, votre page à propos, etc.

Assurez-vous de prévisualiser les mises en page dans leur intégralité pour voir exactement à quoi elles ressemblent.

Si "Remplacer le contenu" est sélectionné, la nouvelle mise en page remplacera toute votre mise en page. Si elle n'est pas sélectionnée, la nouvelle mise en page sera ajoutée au bas de votre contenu existant.

Plus de 40 modules de contenu sont disponibles dans Divi. Il existe des modules pour les images, les vidéos, les cartes, les tableaux de prix, les séparateurs, les appels à l'action, etc.

Divi propose également des modules de contenu uniques pour WooCommerce pour vous aider à répertorier les produits de votre boutique.

Lorsque vous ajoutez un module à votre page, sa boîte de paramétrage s'affiche. Il existe des dizaines de fonctionnalités et de paramètres de style à ajuster ici.

Toutes les modifications que vous apportez à un module peuvent être enregistrées dans la bibliothèque Divi pour une utilisation ultérieure.

Depuis le menu principal de Divi Builder, vous pouvez enregistrer vos mises en page dans la bibliothèque, effacer votre mise en page et exporter votre mise en page au format JSON via la boîte de portabilité.

Divi Library est une fonctionnalité importante de Divi Builder et dont je recommande de profiter.

La bibliothèque Divi stocke tous les modules, colonnes, lignes, conteneurs et mises en page enregistrés que vous avez enregistrés. Vous pouvez accéder à vos mises en page enregistrées depuis Divi Builder ou depuis la page Divi Library qui est répertoriée dans le menu principal d'administration de Divi.

Lorsque vous choisissez de modifier une mise en page, vous verrez votre mise en page en mode d'affichage filaire.

Si vous préférez, vous pouvez afficher la mise en page en mode bureau, tablette ou mobile. Vous pouvez également lancer la mise en page avec le Divi Visual Builder à partir d'ici.

Divi Theme Builder fonctionne en conjonction avec Divi Library pour vous donner plus de contrôle sur la conception de votre site Web.

Il vous permet de créer une mise en page à partir de zéro ou de sélectionner une mise en page dans votre bibliothèque et de l'affecter en tant qu'en-tête, corps ou pied de page. Vous pouvez ensuite spécifier exactement où ces mises en page sont affichées et où elles ne le sont pas.

Par exemple, vous pouvez attribuer un modèle à vos articles de blog d'actualités, un à des didacticiels, un autre à votre page d'accueil et quelque chose de différent à votre page À propos.

Cela vous donne un contrôle total sur le style des différentes zones de votre site Web.

Au lancement de Divi, le thème gérait tout, mais il est structuré très différemment aujourd'hui.

Divi Theme est en fait une conception WordPress minimale qui agit comme une toile pour Divi Builder et d'autres constructeurs de pages WordPress.

Des fonctionnalités telles que Divi Theme Builder illustrent que les thèmes élégants étendent encore plus les fonctionnalités de conception de Divi Builder, mais Divi Theme continue de prendre en charge WordPress Customizer.

Des centaines de paramètres de personnalisation sont disponibles pour Divi dans WordPress Customizer. Vous pouvez ajuster de nombreux paramètres de style différents tels que l'espacement, les polices et les couleurs, et voir le résultat en temps réel.

Sachez cependant que le contenu de vos posts et pages sera toujours contrôlé par Divi Builder.

Malheureusement, Divi Theme n'a pas complètement adopté le WordPress Customizer.

Il existe une douzaine de paramètres de conception qui ne peuvent être modifiés que via la page d'options du thème Divi. Cela inclut les paramètres clés tels que le logo de votre site Web.

Il est curieux de savoir pourquoi Elegant Themes a divisé les options de personnalisation de thème entre deux domaines différents.

Avada – Contenu et mises en page

62 démos thématiques sont disponibles dans Avada.

Les démos de thèmes incluent des mises en page pour de nombreuses zones différentes de votre site Web et sont équivalentes aux packs de mise en page de Divi.

La page des options de thème Avada répertorie toutes les démos de thème. Les démos peuvent être filtrées par catégorie ou en utilisant le champ de recherche.

Alors que Divi propose plus de 150 packs complets de mise en page de sites Web, Avada propose sans doute une meilleure variété de conceptions.

Comme Divi, il existe des mises en page pour les magasins, les blogs et les entreprises, mais il existe également des démos thématiques qui ont été créées pour des sujets de niche tels que le référencement, la crypto-monnaie, les sports électroniques et les forums de discussion.

Des aperçus complets du site Web sont également disponibles pour chaque conception.

Lorsque vous cliquez pour importer une démo de thème, Avada vous indique quels plugins WordPress doivent être activés pour qu'il fonctionne correctement.

Si vous souhaitez que votre site Web corresponde à ce que vous voyez dans l'aperçu, vous devrez également importer le contenu de la démonstration. Avada vous permet de sélectionner le contenu à importer et il existe une option pour supprimer le contenu précédemment importé, tel que les publications et les pages.

Avada affiche un avertissement avant l'importation qui vous rappelle que l'importation remplacera votre thème WordPress actuel.

Avada remplacera le nom de votre site Web par le nom de la démo de thème que vous avez importée.

Bien que cela vous rappelle le dernier design que vous avez importé, il est ennuyeux de devoir changer le nom de votre site Web à chaque fois que vous importez une mise en page.

Des démos sont également disponibles dans Fusion Builder via le bouton de la bibliothèque.

La bibliothèque Fusion Builder répertorie les démos de thème et toutes les mises en page que vous avez enregistrées pour les modèles, les conteneurs, les colonnes et les éléments.

Si vous importez une démo de thème de cette façon, vous ne pouvez importer qu'une seule page et il n'y a pas d'option pour importer le contenu de la démo.

À cet égard, je pense qu'Elegant Themes a fait un meilleur travail en intégrant des mises en page prédéfinies dans Divi Builder. Dans Avada, vous devez sortir de l'éditeur pour importer entièrement la mise en page d'un site Web.

Les éléments sont les éléments constitutifs du contenu que vous ajoutez à vos mises en page.

WordPress les appelle blocs dans l'éditeur Gutenberg, et Divi les appelle modules, mais ils font tous référence à la même chose.

Une soixantaine d'éléments sont disponibles dans Fusion Builder, soit 50% de plus que dans Divi Builder.

Il existe une bonne variété d'éléments proposés tels que des graphiques, des zones de contenu, des carrousels d'images, des tableaux de prix et des témoignages.

Lorsque vous sélectionnez un élément, ses paramètres s'affichent dans votre barre latérale de paramètres.

Des options de personnalisation du design sont disponibles pour chaque élément. Cependant, Divi Builder propose de nombreuses autres options de style et de personnalisation.

Lorsque vous cliquez pour ajouter un élément, vous pouvez également ajouter de nouvelles lignes. Il existe de nombreuses configurations de colonnes imbriquées différentes que vous pouvez insérer dans votre mise en page.

Une fois que vous avez inséré des colonnes, vous pouvez les remplir avec des éléments de contenu.

Même si Divi Builder vous offre plus d'options de style et de personnalisation pour vos mises en page, Fusion Builder Live compense largement cela avec son personnalisateur de thème intégré.

En un clic, vous pouvez basculer entre la modification de la mise en page d'un article ou d'une page et l'ajustement de centaines de paramètres différents au niveau de la page ou au niveau du site Web.

La page d'options Avada contient des centaines de paramètres. La plupart d'entre eux peuvent également être trouvés dans Fusion Builder Live, et vous pouvez accéder à l'interface Fusion Builder Live à tout moment en utilisant le bouton "Modifier en direct".

La page principale des options d'Avada contient des paramètres supplémentaires, il est donc utile de parcourir chaque section ici lors de la première configuration de votre site Web.

Les éléments de contenu individuels peuvent être activés et désactivés à partir de la page des paramètres de Fusion Builder.

À partir de cette page, vous pouvez faire de Fusion Builder l'éditeur par défaut et activer et désactiver Fusion Builder pour certains types de publication. Vous pouvez également importer et exporter du contenu Fusion Builder à l'aide du format de fichier XML.

Tout au long de Fusion Builder Live, vous verrez des options pour enregistrer des parties de votre mise en page dans la bibliothèque Fusion Builder.

Vous pouvez nommer vos mises en page enregistrées et les marquer comme globales. Une fois enregistrés, ils peuvent être chargés à tout moment dans Fusion Builder.

La page Bibliothèque de Fusion Builder se trouve dans le menu principal de Fusion Builder.

Tous les éléments que vous avez enregistrés peuvent être consultés et modifiés ici.

Par défaut, les éléments enregistrés seront chargés à l'aide de l'éditeur principal de Fusion Builder, mais vous pouvez également choisir d'apporter des modifications à l'aide de l'éditeur frontal Fusion Builder Live.

Avada propose également un générateur de thèmes qui vous permet d'attribuer des mises en page à une barre de titre de page, à une zone de contenu et à un pied de page. Ces mises en page sont des sections étiquetées et peuvent être modifiées à l'aide des éditeurs frontaux ou frontaux de Fusion Builder.

Contrairement à Divi Builder, il n'y a aucun moyen de spécifier où les mises en page sont affichées.

Il y a des fonctionnalités que j'aime dans les deux éditeurs, mais la barre latérale des paramètres de Fusion Builder Live fait vraiment passer l'édition en direct au niveau supérieur. La possibilité de modifier la mise en page, les paramètres de page et la conception du site Web, le tout à partir d'une seule interface, permet de gagner beaucoup de temps.

Conclusion - Contenu et mises en page

Le système de bibliothèque de Divi Builder et sa longue liste d'options de personnalisation du constructeur de pages en font le meilleur constructeur de pages WordPress.

La façon dont les mises en page prédéfinies sont intégrées dans Divi Builder est également meilleure, mais Avada offre la meilleure expérience globale de conception et d'édition.

Alors que Divi divise les paramètres de conception clés entre la page d'options de thème Divi et le personnalisateur WordPress, Avada vous permet de tout contrôler à partir d'un emplacement central à l'aide de l'éditeur Fusion Builder Live. C'est une fonctionnalité étonnante qui fait que Fusion Builder Live se démarque de la foule.

Vainqueur : Avada

Autres fonctionnalités et paramètres

Il est impossible de parler de toutes les fonctionnalités de Divi et Avada car ce sont des thèmes WordPress si volumineux, cependant dans cette section, je voudrais parler de quelques autres fonctionnalités utiles disponibles dans Divi et Avada que je n'ai pas encore mentionnées.

Divi – Autres fonctionnalités et paramètres

Les thèmes élégants ont migré la plupart des fonctionnalités vers Divi Builder, mais lorsque Divi est activé, vous verrez également un nouveau type de publication personnalisé "Projets" dans votre menu d'administration WordPress.

Divi Builder dispose déjà d'un module de contenu de portefeuille, mais le type de publication des projets vous offre plus de flexibilité dans l'affichage et la catégorisation des éléments.

Divi ajoute également quelques options supplémentaires aux publications et aux pages pour attribuer la position de la barre latérale et définir si le menu de navigation et la barre de titre sont affichés.

Comme indiqué précédemment, la zone d'options du thème principal comporte de nombreuses options de conception qui ne peuvent pas être trouvées dans WordPress Customizer.

La zone d'options propose également divers paramètres pour votre menu de navigation, Divi Builder, des articles et des pages uniques, une bannière publicitaire 468X60 et le référencement. Il existe également des options pour ajouter du code personnalisé aux pages.

L'éditeur de rôles Divi est disponible dans Divi Builder et Divi Theme.

À l'aide de l'éditeur de rôle, vous pouvez spécifier exactement ce que les utilisateurs peuvent et ne peuvent pas faire dans Divi Builder. Des dizaines de fonctionnalités peuvent être activées et désactivées pour les groupes d'utilisateurs en un clic.

Avada - Autres fonctionnalités et paramètres

Le nombre de façons d'ajouter des diapositives dans Avada est à la limite du ridicule.

Inside Fusion Builder est un élément Slide permettant d'intégrer des diapositives dans vos mises en page, mais Avada dispose également de deux types de publication personnalisés Slider intégrés au thème.

Ce sont Elastic Slider et Fusion Slider, Fusion Slider étant le type de publication utilisé par les démos de thème Avada.

Si cela ne vous suffit pas, Avada est également livré avec Layer Slider et Slider Revolution.

Ces plugins WordPress de slider avancés sont les deux solutions de slider premium les plus vendues disponibles pour les utilisateurs de WordPress.

Les types de publication Portfolio et FAQ sont également disponibles dans Avada.

Des ensembles d'icônes personnalisés peuvent également être créés dans Avada et il existe 10 extensions de plug-in pour Avada sur CodeCanyon qui ajoutent des fonctionnalités telles que les adhésions, les champs personnalisés, les avis, les témoignages, etc.

Veuillez noter que pour obtenir une prise en charge complète de l'un des plugins premium inclus avec Avada, vous devrez acheter une licence pour le produit séparément.

Conclusion - Autres fonctionnalités et paramètres

Divi et Avada sont en constante évolution, vous pouvez donc vous attendre à ce que de nombreuses autres fonctionnalités soient ajoutées au cours des prochaines années.

Alors que Divi vous offre le plus d'options de style pour la création de pages, Avada vous donne plus de contrôle sur votre site Web.

Vainqueur : Avada

Performance

Un site Web à chargement rapide améliorera le classement de votre moteur de recherche et gardera les visiteurs sur votre site Web plus longtemps, mais tester avec précision la vitesse des thèmes WordPress peut être difficile car il y a tellement de facteurs à prendre en compte.

De plus, si vous souhaitez comparer la vitesse de Divi et d'Avada par rapport à d'autres thèmes WordPress, de nombreuses hypothèses doivent être faites à tous les niveaux pour faire une comparaison équitable.

Divi et Avada sont tous deux capables de créer des sites Web WordPress à chargement rapide, mais si vous créez des mises en page riches en médias à l'aide de leurs éditeurs frontaux, vos pages ralentiront. Ceci est bien sûr vrai pour tout thème WordPress.

Pour vous aider à améliorer les performances de votre site Web et à réduire la charge que les constructeurs de pages peuvent ajouter, les développeurs de Divi et Avada ont ajouté de nombreuses fonctionnalités à leurs thèmes pour vous aider à générer moins de requêtes de base de données et de requêtes HTTP.

Divi – Performances

Dans la page des paramètres généraux de la zone Options du thème Divi, il existe des options pour activer les images réactives, et réduire et combiner les fichiers CSS et Javascript.

Dans la page des paramètres de Divi Builder, il existe également une option pour activer la génération de fichiers CSS statiques.

Avada – Performances

Avada a une douzaine de paramètres de performance. Ceux-ci peuvent être modifiés via la page d'options du thème principal ou dans Fusion Builder Live.

Le thème vous permet de définir la qualité des images JPG et d'optimiser les images plus grandes sur une certaine largeur.

Le chargement différé est également disponible et vous pouvez charger des feuilles de style à partir de votre pied de page.

Avada fournit également plusieurs outils pour optimiser les fichiers CSS et Javascript.

Conclusion – Performances

Divi et Avada sont tous deux capables d'alimenter un site Web WordPress à chargement rapide, mais vous devez toujours suivre les techniques d'optimisation WordPress recommandées.

Assurez-vous de vérifier la page d'état du système dans les deux thèmes WordPress pour vous assurer que vous répondez aux exigences de leur exécution efficace. Si les temps de réponse du serveur sont lents, vous pouvez envisager de passer à une solution d'hébergement plus rapide.

Les plugins d'optimisation d'image WordPress peuvent être utiles si vos pages contiennent de nombreuses images.

Les plugins de mise en cache tels que WP Rocket et les réseaux de diffusion de contenu tels que KeyCDN peuvent réduire davantage la taille des pages.

Gagnant : Égalité

Assistance et documentation

Lorsqu'il s'agit de fournir un excellent support, Elegant Themes et Theme Fusion ouvrent la voie dans le monde WordPress.

Divi – Assistance et documentation

Au sein du centre de support Divi, il existe une option permettant au personnel d'Elegant Themes d'accéder à distance à votre site Web. Cela peut aider l'équipe d'assistance à résoudre les problèmes que vous rencontrez.

Ci-dessous, vous verrez un lien direct vers la zone d'assistance d'Elegant Themes et plusieurs didacticiels vidéo pour vous aider à démarrer.

Des icônes d'aide sont également disponibles dans Divi Builder pour expliquer à quoi sert chaque fonctionnalité.

La zone de documentation des thèmes élégants est incroyable. Il existe des centaines de didacticiels écrits et de didacticiels vidéo pour vous guider dans l'utilisation de Divi et d'autres produits. Le blog Elegant Themes publie également fréquemment des didacticiels.

Vous pouvez également vous connecter avec d'autres utilisateurs de Divi via un groupe Facebook, un forum communautaire et une rencontre locale.

Si vous avez besoin d'aide supplémentaire, vous pouvez créer un ticket d'assistance 24h/24 et 7j/7 et recevoir de l'aide.

Contrairement à la plupart des thèmes WordPress, les thèmes élégants offrent une prise en charge à un nombre illimité d'utilisateurs. Ceci est utile pour les entreprises qui ont de nombreux employés.

Avada – Assistance et documentation

Avada dispose d'une page de support et de FAQ dédiée qui est répertoriée dans les menus d'administration d'Avada et de Fusion Builder.

Étant donné qu'Avada est vendu via ThemeForest, vous devrez créer un compte d'assistance avec Theme Fusion afin d'ouvrir des tickets d'assistance.

Pour en savoir plus sur Avada, vous devez vous référer au guide de démarrage, à la zone de documentation et aux didacticiels vidéo répertoriés sur la page de support Avada.

Cette page est également liée à la page d'assistance des tickets Avada, au forum de la communauté et au groupe Facebook.

Plusieurs questions fréquemment posées sont également abordées sur cette page.

Une fois que vous avez commencé à explorer la zone de documentation Avada et Fusion Builder, vous commencez à apprécier son étendue.

Chaque aspect du thème Avada et de Fusion Builder est couvert ici.

Conclusion – Assistance et documentation

La documentation complète disponible pour Divi et Avada signifie que vous aurez rarement à demander de l'aide, mais les deux thèmes WordPress fournissent un ticket d'assistance 24h/24 et 7j/7 si vous en avez besoin.

Gagnant : Égalité

Coût

Le coût est un facteur que tous les propriétaires de sites Web doivent prendre en compte en plus des caractéristiques et des fonctionnalités.

Divi ou Avada sont tous deux proposés à des prix compétitifs, mais quelle solution offre le plus de valeur ?

Coût – Divi

Un abonnement à Elegant Themes vous donne accès à Divi Theme et au plugin autonome Divi Builder WordPress.

Il comprend également le thème WordPress du magazine Extra, le plugin WordPress d'inscription aux e-mails et de génération de leads Bloom, et le plugin WordPress de médias sociaux Monarch.

La politique de prix d'Elegant Themes est simple.

Leur adhésion annuelle coûte 89 $ et comprend un an d'assistance et de mises à jour. Vous pouvez continuer à utiliser tous les produits Elegant Themes une fois votre abonnement expiré, mais vous ne recevrez une assistance et des mises à jour que si votre abonnement est actif.

L'adhésion à vie coûte 249 $ et comprend une assistance et des mises à jour à vie.

Les deux plans d'adhésion permettent une utilisation illimitée du site Web et sont assortis d'une garantie de remboursement de 30 jours.

Divi est peut-être la raison pour laquelle vous vous inscrivez à Elegant Themes, mais tous leurs produits sont de haute qualité et rendent l'adhésion plus attrayante.

Extra est un skin de Divi Theme qui a une fonction de création de catégorie supplémentaire. Cela peut être utilisé pour créer des mises en page et des styles uniques pour chaque catégorie de publication. Par exemple, vous pouvez avoir un design pour votre page d'accueil, un pour les actualités et un autre pour les tutoriels.

Comme Divi Theme, Divi Builder est intégré directement dans Extra.

Bloom est une solution de marketing par e-mail qui vous permet d'afficher un formulaire d'inscription à la newsletter de six manières différentes. Vous pouvez définir le moment où les formulaires sont affichés, par exemple après qu'un utilisateur a fait défiler jusqu'à un certain point de la page ou une fois qu'il a publié un commentaire.

Il prend en charge 19 services de marketing par e-mail différents et est livré avec des centaines de formulaires de newsletter prédéfinis.

Le plugin WordPress de médias sociaux Monarch est également une solution fantastique.

Il vous permet d'afficher les boutons de partage de plus de 20 réseaux sociaux dans cinq emplacements différents. Chaque bouton peut être stylé et personnalisé selon vos besoins.

Coût – Avada

Avada se vend sur ThemeForest pour 60 $.

Il est livré avec des mises à jour illimitées et six mois de support, qui peuvent être étendus à 12 mois pour 18 $ supplémentaires.

Une multitude de plugins WordPress premium sont également inclus dans le package Avada.

Avada a été publié sous la licence régulière ThemeForest, qui est classée par ThemeForest comme un produit à usage unique.

Il y a eu de nombreux désaccords publics entre Envato (ThemeForest) et WordPress à propos de cette politique de licence, car elle va à l'encontre de la licence publique GNU sous laquelle WordPress est publié et stipule que l'utilisation ne doit pas être restreinte.

Malgré cela, les développeurs d'Avada précisent sur leur site qu'« un seul achat d'Avada est requis pour chaque site que vous créez ».

En termes simples, si vous souhaitez utiliser Avada sur plusieurs sites Web, vous devez acheter une licence distincte pour chacun.

Les plugins WordPress premium inclus avec Avada vous coûteraient plus de 100 $ si vous les achetiez tous séparément.

Convert Plus (24 $) est un plugin WordPress de marketing par e-mail disponible dans Avada qui vous permet d'afficher les formulaires d'inscription par e-mail de 12 manières différentes. Il propose des centaines de modèles de formulaires de newsletter prédéfinis et s'intègre à tous les principaux services de marketing par e-mail.

Advanced Custom Fields est un plugin WordPress de gestion de champs extrêmement populaire qui compte plus d'un million de téléchargements sur WordPress.org. La version pro des champs personnalisés avancés (49 $ et plus) incluse avec Avada introduit de nouvelles fonctionnalités telles que le champ de répéteur, les blocs ACF, le champ de contenu, le champ de clonage, etc.

Les deux plugins de slider WordPress les plus populaires sur le marché sont Layer Slider (25 $ +) et Slider Revolution (29 $) et les deux sont inclus avec Avada.

Ces plugins vous permettent de créer des curseurs avancés avec des couches à l'aide d'une interface moderne de glisser-déposer et sont livrés avec des centaines de modèles prédéfinis pour vous aider à démarrer.

Conclusion – Coût

Comparer le coût de deux thèmes WordPress n'est jamais simple lorsqu'ils sont vendus sous différents modèles de tarification.

Divi et Avada sont livrés avec des produits WordPress supplémentaires de haute qualité, mais vous seul pouvez décider si ces extras vous offrent une valeur, alors assurez-vous de prendre en compte la façon dont vous utiliserez Divi et Avada pour vous aider à prendre une décision éclairée.

Une adhésion à Elegant Themes accorde une utilisation illimitée, donc si vous envisagez de créer de nombreux sites Web, Divi est l'option la moins chère.

Si vous n'avez besoin que d'un thème WordPress pour un site Web, Avada sera moins cher car il peut être récupéré pour seulement 60 $ et est livré avec des mises à jour à vie.

En ce qui concerne les coûts, Divi devance légèrement Avada car il adhère à la licence publique générale et offre une assistance à un nombre illimité d'utilisateurs.

Vainqueur : Divi

Dernières pensées

Bien que j'aime WordPress Customizer, Theme Fusion a fait un travail fantastique en intégrant les options de personnalisation de thème directement dans Fusion Builder Live. Cela fonctionne très bien et réduit le temps que vous passez à modifier votre site Web.

Je choisirais donc Avada si vous recherchez une solution qui vous permet de contrôler tous les aspects de la conception de votre site Web à partir d'une seule interface.

Là où Divi continue d'être en tête, c'est le système Divi Library. Les thèmes élégants ont affiné cette configuration au fil des ans pour simplifier la tâche d'enregistrement des mises en page, de personnalisation et de réutilisation des conceptions.

Donc, si vous recherchez principalement un constructeur de pages WordPress pour vous aider à créer un contenu élégant et des mises en page professionnelles, Divi est le meilleur choix.

Divi et Avada sont toutes deux d'excellentes solutions, il s'agit donc vraiment de savoir quel thème WordPress vous convient le mieux.

Voici un récapitulatif de la comparaison entre Divi et Avada :

Quel est votre thème WordPress préféré ?

Veuillez nous en informer dans la zone de commentaires ci-dessous.

Si vous avez apprécié cet article, je vous encourage à nous suivre sur Twitter et Facebook. Vous devriez également consulter notre vaste gamme de thèmes WordPress gratuits et premium.

Bonne chance.
Kévin