Un regard sur les thèmes élégants Divi 2.4

Divi est actuellement le thème WordPress le plus puissant et le plus avancé d'Elegant Themes et il vient d'être mis à jour avec la plus grande mise à jour de son histoire. Divi vous donne des blocs de construction que vous pouvez utiliser pour créer des mises en page et des zones de contenu intéressantes. Vous pouvez ajouter du texte, des curseurs, des cartes, des présentations, des accordéons, des structures de prix et bien plus encore. Vous pouvez créer pratiquement n'importe quel type de site Web dont vous avez besoin. Et bien sûr, il est réactif.

Je suis utilisateur de Divi depuis le premier jour de sa sortie. Dans cet article, je partage mes réflexions sur Divi et jette un œil aux nouveautés de la version 2.4.

Quoi de neuf dans la version 2.4

Divi 2.4 est la base de la future gamme de produits ET. Il a plus de 1000 paramètres de conception et de personnalisation de module et ajoute quelques fonctionnalités intéressantes :

• Paramètres globaux - plus facile d'effectuer des ajustements à l'échelle du site
• Grille fluide - la mise en page n'a pas de largeurs fixes. Avec la grille fluide, vous pouvez créer vos propres largeurs.
• Paramètres avancés du constructeur - chaque module dispose de paramètres CSS avancés à partir d'une interface utilisateur simple.
• Bibliothèque Divi – mises en page avancées.

Options du thème

Tous les thèmes ET utilisent un écran d'options appelé epanel. Les caractéristiques de l'epanel changent en fonction des caractéristiques du thème. L'epanel de Divi est vaste. Il contient les bases, telles que le logo, le favicon, la barre de navigation fixe, la première image, le style de blog, le nombre de publications à afficher, etc. Il ajoute de nombreuses options, notamment :

• Page de la boutique WooCommerce
• Clé MailChimp
• Autorisation Weber
• Icônes de médias sociaux
• URL des réseaux sociaux
• Polices Google
• Défilement fluide - permet à la ligne suivante et à son contenu de s'estomper lors du défilement
• Shortcodes réactifs
• Bouton Retour en haut
• CSS personnalisé
• Et plus

Les paramètres de navigation incluent les pages, les catégories, le lien d'accueil, le menu déroulant, etc. Vous pouvez effectuer de nombreuses personnalisations uniquement à partir de l'epanel.

Personnalisateur de thème

Le personnalisateur de thème fonctionne à partir du front-end et ajoute de nombreux curseurs pour ajuster les tailles de police, les styles, les lignes, les boutons, les couleurs, les animations, la taille de l'en-tête, la taille du pied de page, l'image d'arrière-plan et bien plus encore. Vous pouvez faire tous vos ajustements et voir les effets au fur et à mesure qu'ils se produisent (WYSIWYG - ce que vous voyez est ce que vous obtenez).

Vous pouvez placer vos coordonnées et vos liens sociaux dans l'en-tête. L'en-tête est un choix particulièrement judicieux pour les entreprises car il place les informations importantes au premier plan et reste à l'écran lorsque les lecteurs défilent vers le bas. Il comprend également la disposition et la topographie. Tout comme les personnalisations standard, vous pouvez choisir la navigation, les widgets et une page d'accueil statique.

Il vous permet même de régler les paramètres mobiles pour la tablette et le téléphone, et chacun est indépendant de tous les autres paramètres et les uns des autres. Vous voyez les effets sur un écran qui simule l'appareil mobile afin que vous puissiez voir à quoi il ressemble avant de publier. C'est une fonctionnalité intéressante car vous n'avez pas besoin d'un appareil mobile pour vérifier l'apparence du site avec les ajustements que vous venez de faire. Je suis vraiment content de voir cela inclus.

Personnalisateur de module

Vous pouvez personnaliser l'apparence des modules sur le front-end à l'aide du module de personnalisation. Les personnalisations incluent des curseurs pour les tailles, largeurs, hauteurs, etc. Vous pouvez également choisir des polices, des styles, des animations, des actions, etc.

Bibliothèque Divi

La bibliothèque Divi contient les mises en page que vous avez créées. Vous pouvez modifier n'importe laquelle de vos mises en page et créer de nouvelles mises en page à partir de ce menu.

Le constructeur Divi

La vraie magie de Divi se produit lorsque vous utilisez The Divi Builder. Vous l'utilisez en sélectionnant le bouton intitulé Utiliser le Divi Builder au-dessus de l'éditeur visuel. L'édition précédente avait Page Builder, qui ne fonctionnait qu'avec des pages. Divi Builder fonctionne avec tous les types de publications.

• Divi ajoute également des paramètres de publication à votre éditeur afin que vous puissiez choisir la mise en page, la navigation par points, masquer la navigation et masquer le titre de la publication sur chaque publication si vous le souhaitez.

Vous pouvez charger une mise en page ou modifier la mise en page par défaut. Une mise en page est composée de sections avec des lignes et des colonnes. Les modules sont ensuite placés dans les colonnes. Vous pouvez modifier la mise en page en faisant glisser et en déposant n'importe quelle section, ligne, colonne ou module.

Sections

Les sections peuvent être ajoutées, supprimées, clonées et modifiées. Vous pouvez modifier l'apparence et la réaction de l'arrière-plan, ajouter une image d'arrière-plan, rendre l'arrière-plan transparent, choisir sa couleur, lire une vidéo, choisir sa taille globale, s'il peut ou non être mis en pause par d'autres joueurs, s'il a une ombre intérieure , s'il utilise un effet de parallaxe, et définissez un CSS spécial. En utilisant ces paramètres, vous pouvez donner à la même mise en page simple un aspect unique.

Vous pouvez également créer un clone de chaque section - avec les mêmes lignes, modules, contenu et paramètres. Bien sûr, vous pouvez ensuite modifier la nouvelle section comme vous le souhaitez.

Il existe quatre types de sections différents. Vous pouvez ajouter une section standard, une section pleine largeur, une section spécialisée ou ajouter à partir de la bibliothèque.

Lignes

Vous pouvez ajouter de nouvelles lignes et modifier les lignes existantes. Les colonnes peuvent ensuite être placées sur les lignes, créant ainsi votre mise en page.

Colonnes

Ces colonnes sont l'endroit où les modules seront ajoutés. Vous avez le choix entre 11 dispositions de colonnes différentes.

Sections spécialisées

Il existe également 9 dispositions de colonnes spécialisées. Ceux-ci incluent diverses options pour les barres latérales.

Charger depuis la bibliothèque

Vous pouvez charger des mises en page à partir des 32 mises en page prédéfinies ou des mises en page à partir de ce que vous avez créé. Chacun peut être modifié. Les mises en page comprennent un nombre varié de colonnes, de grilles, de carrousels, de barres latérales, de pages d'accueil, de boutiques, d'entreprise, de portefeuilles, de blogs, du mode de maintenance, à venir, de la page de destination, de la page de vente, des études de cas, des fonctionnalités du produit, des pages à propos, des pages de contact, pages d'achat, et plus encore.

Votre page est construite en établissant des lignes, en plaçant des colonnes dans ces lignes, puis en plaçant des modules dans ces colonnes. Vous pouvez ajouter de nouvelles lignes, déplacer des lignes par glisser-déposer ou supprimer des lignes. Les mises en page pré-faites les ont déjà faites pour vous. J'ai choisi Homepage Basic et cela m'a donné une mise en page avec un curseur, un en-tête, quatre présentations et un appel à l'action.

Modules

Les modules sont des types de contenu spéciaux (comme les widgets). Vous pouvez ajouter de nouveaux modules, les faire glisser et les déposer dans l'ordre de votre choix ou les supprimer. Vous pouvez également ajouter différents types de contenu. Vous pouvez avoir autant de modules que vous le souhaitez et les utiliser dans n'importe quelle combinaison. Vous n'êtes pas limité dans le nombre de fois que vous utilisez le même module. Par exemple, si vous voulez un écran plein de cartes, ajoutez simplement autant de modules de cartes que vous le souhaitez.

Il y a 40 modules :

C'est suffisamment de modules pour que vous puissiez créer des mises en page et des fonctionnalités intéressantes pour votre site Web. Les modules sont l'une des forces de Divi. En plaçant des modules dans des colonnes, vous pouvez littéralement créer une mise en page qui vous est propre. À l'aide de modules, Divi vous permettra de créer à peu près n'importe quel type de site que vous souhaitez.

Chaque module a ses propres paramètres. La plupart d'entre eux ont un éditeur, des paramètres de conception avancés et des paramètres CSS, vous pouvez donc ajouter leur contenu et modifier leur apparence. Voici quelques modules et leurs fonctionnalités :

Texte

Le texte vous donne l'éditeur de base et les sélections pour la couleur et l'orientation du texte, les paramètres de conception avancés (curseurs pour les largeurs, les hauteurs, les couleurs, les marges, etc.) et le CSS personnalisé. La plupart des modules incluent ces fonctionnalités ou des fonctionnalités similaires.

Présentation

J'ai cliqué sur Blurb pour voir quel type de contenu je pouvais ajouter. Ici, je peux lui donner un titre, une URL, déterminer le fonctionnement de l'URL, lui donner une icône, choisir des couleurs, des polices, des extensions, puis ajouter du contenu à l'aide de l'éditeur TinyMCE standard. Les paramètres de conception avancés incluent les mêmes paramètres que le module de texte, mais avec un paramètre d'image supplémentaire.

Carte

Map vous donne une belle carte que vous pouvez afficher comme une carte régulière (avec ou sans terrain) ou la voir en vue satellite (avec ou sans étiquettes). Vous pouvez ajouter des repères pour mettre en évidence des emplacements spécifiques sur la carte. Il vous suffit de saisir l'adresse et de sélectionner pour ajouter une nouvelle broche. Les paramètres avancés vous donnent un filtre en niveaux de gris avec des contrôles de pourcentage.

Blog

Le module Blog est intéressant. Il vous permet de placer des articles de blog dans une seule colonne de la largeur de votre choix. La raison pour laquelle j'aime cela est que vous pouvez avoir une page d'accueil statique et toujours afficher les articles de votre blog à partir de catégories spécifiques que vous choisissez. Vous pouvez en afficher autant que vous le souhaitez et vous pouvez afficher un extrait, le nom de l'auteur, la date, les catégories, la pagination, l'image en vedette, le bouton Lire la suite, etc. Cela ferait une mise en page intéressante de style magazine. Il inclut les mêmes paramètres de conception avancés que le module de texte, mais avec quelques paramètres supplémentaires pour les couleurs d'arrière-plan et les en-têtes.

Titre de l'article

C'est l'un des nouveaux modules. Il vous permet de concevoir l'apparence du titre du message et de choisir ce qui est inclus et ce qui ne l'est pas. Les fonctionnalités de conception avancées sont pour la plupart les mêmes que celles du module de texte avec quelques paramètres supplémentaires tels que la couleur d'arrière-plan.

Voici un aperçu des paramètres de conception avancés pour le module de titre de publication.

Utiliser Divi comme thème régulier

Bien sûr, vous n'êtes pas obligé d'utiliser l'une de ces fonctionnalités. Vous pouvez simplement utiliser Divi comme vous le feriez avec n'importe quel autre thème. Choisissez simplement le paramètre que vous souhaitez dans l'epanel et créez du contenu comme d'habitude - à l'aide de l'éditeur standard. Cela crée un site Web ou un blog simple et propre, suffisamment élégant pour être utilisé tel quel.

Support linguistique

Divi prend en charge plus de 30 langues et peut être traduit dans d'autres. Cela inclut le frontal et le générateur, qui s'affiche même de droite à gauche lorsqu'un langage RTL est activé.

Obtenir Divi

Divi fait partie du plan personnel d'ET qui coûte 69 $ par an et comprend l'accès à tous les thèmes, les mises à jour perpétuelles, l'assistance et une utilisation illimitée. Si vous annulez votre abonnement, vous conservez tout ce que vous avez téléchargé sur ET.

Divi vaut à lui seul ce prix à mon avis (surtout si l'on considère que la plupart des thèmes de ce calibre coûtent beaucoup plus que cela), mais si l'on considère que cela inclut 87 thèmes et plus, rejoindre Elegant Themes pendant au moins un an est un non- cerveau.

Plus loin sur la route

Les prochaines versions à l'ordre du jour d'ET sont le plugin Divi Builder, un thème de magazine appelé Extra qui partagera les mêmes éléments de construction mais avec un focus sur la mise en page du magazine, puis Divi 3.0. Il est clair qu'ET est pleinement engagé dans le succès de Divi et de la plateforme Divi Builder. Maintenant que j'ai vu Divi 2.4, je ne peux pas imaginer les améliorations et les fonctionnalités de Divi 3.0.

Plugin constructeur Divi

Un inconvénient de Divi est qu'une fois que vous avez créé une mise en page, vous ne pouvez pas changer de thème sans recréer les pages et les publications. ET a résolu ce problème avec un plugin gratuit qui maintient la mise en page quel que soit le thème que vous utilisez. Vous pouvez conserver toutes vos mises en page et modules même si vous n'utilisez pas de thème d'ET. Ce plugin devrait être disponible prochainement.

Dernières pensées

Divi peut créer des mises en page complexes mais reste facile à utiliser. Il n'a pas une grande courbe d'apprentissage. Vous pouvez facilement ajouter des éléments et les faire glisser et les déposer où vous voulez pour créer vos propres mises en page personnalisées et modifier leur apparence avec des curseurs. Ils peuvent être aussi complexes ou aussi simples que vous le souhaitez.

Cela peut prendre un certain temps pour obtenir votre mise en page comme vous le souhaitez, mais au moins vous pouvez enregistrer vos mises en page en tant que modèles ou utiliser des mises en page prédéfinies, ce qui peut vous faire gagner beaucoup de temps de développement. Il est plus facile que jamais d'effectuer des réglages de style avancé et chaque paramètre dispose d'un bouton d'annulation pour que vous n'ayez pas à vous soucier des erreurs. Les sites créés avec Divi sont impressionnants sur n'importe quel appareil et se chargent rapidement. Je recommande fortement Divi 2.4 de Elegant Themes.

En savoir plus sur Divi et télécharger ici

Et toi? Avez-vous essayé Divi ? Votre expérience ressemble-t-elle à la mienne ? Avez-vous quelque chose à ajouter? Parlez-nous-en dans les commentaires ci-dessous.