Divi 2 Thème hybride pour WordPress

Je connaissais les Frameworks, les thèmes premium aux nombreuses options et les plugins "constructeur de pages", en revanche, je ne connaissais pas DIVI 2, le petit dernier de chez Elegant Themes.

Force est de constater que c'était une erreur que je vais m'empresser de corriger avec cet article;)

divi-2-modules

Framework ou Constructeur de pages ?

On sait que de plus en plus d'utilisateurs veulent un maximum de simplicité. La possibilité de créer des pages complexes en un minimum de codage et de temps.

On a ainsi vu fleurir d'excellents plugins de mise en page, citons par exemple l'excellent Visual Composer ou bien encore Live Composer.

Du côté des thèmes nous pourrions citer les framework tels que Genesis ou Canvas mais aussi certains thèmes premium comme Avada, Salient ou Enfold qui offrent de nombreuses options.

Pourtant en utilisant DIVI, j'ai découvert autre chose... Un savant mélange des 2. Un thème hybride permettant des layouts complexes (mises en forme) et une véritable intégration/interaction du thème et du constructeur de page.

Divi WordPress Theme

 

DIVI 2 Thème WordPress par Elegant Themes

Le principe de fonctionnement de DIVI est similaire à n'importe quel thème. On télécharge le dossier ZIP et on installe !

Le epanel DIVI

Une fois DIVI installé, on retrouve un epanel depuis Apparence>>Divi Theme Options permettant de régler entre autres, les différents paramètres tels que le logo, la favicon, l'excerpt, la gestion des Ads...

Ce epanel est relativement sommaire (on pourrait même dire moche;) et la première des choses qui m'a marqué c'est que l'on n'y retrouve pas les habituelles options de customisation (polices, couleurs), nous verrons par la suite qu'elles sont juste situées ailleurs.

epanel-DIVI

 

Customiser DIVI

Pour modifier l'apparence de DIVI, il vous faudra passer par le menu Apparence>>Personnaliser. Avec la possibilité de choisir l'orientation du menu, le choix des polices, des couleurs, etc... Déroutant de prime abord pour un premium, c'est au final bien plus intuitif et beaucoup plus visuel.

DIVI-apparence-theme

 

Pour le header, c'est également dans Apparence>> Personnaliser. Vous pourrez ainsi décider d'afficher votre menu principal verticalement ou horizontalement, décider de centrer ou pas votre logo.

divi-headers

 

Créer des pages simplement avec DIVI

C'est le point fort du thème, le constructeur de pages intégré et ses nombreux layouts (modèles). En un clic sur le bouton "Use Page Builder", le constructeur de page se substitue à l'éditeur habituel et vous propose une interface "Drag & Drop" claire, intuitive, rapide et sans aucune latence.

Travailler sur une page sans ralentissement, une prévisualisation des brouillons ultra rapide et une customisation impressionnante, j'ai tout bonnement été bluffé par la simplicité et la prise en main du constructeur de page intégré DIVI.

A noter toutefois, le "contructeur de pages" n'est activable que sur les "pages", autrement dit pour les articles vous devrez utiliser les habituels shortcodes.

DIVI-ajouter-page

 

De nombreux layouts sont fournis, c'est un atout non négligeable qui permet d'aller très vite dans la construction des pages. Cela peut aussi être utile aux personnes qui manquent cruellement d'inspiration.

J'en ai compté pas moins de 33, sans tenir compte de ceux que vous pourriez enregistrer vous-même. On y retrouve des modèles pour page d'accueil, portfolio, contact, landing page, ... Cliquez sur "Load" et vous avez instantanément un canevas complet pour la page de votre choix.

DIVI-modeles-de-page

 

Bien évidemment, vous pouvez modifier à foison ce modèle en y ajoutant de nouvelles sections, des colonnes et de nombreux modules. Ci-dessous, un exemple de layout.

DIVI-constructeur-page

 

Les modules sont très nombreux et comblent quasiment tous les besoins (image, galerie, texte, table prix...). Pas moins de 28 modules vous sont proposés!

DIVI-modules-de-page

 

Barres latérales et Widgets

La gestion des barres latérales n'est pas en reste puisque vous pouvez en créer autant que vous voulez. La gestion se fait depuis Apparence>>Widgets ou vous pourrez ajouter simplement vos propres zones de widgets.

DIVI-sidebars

 

Et bien plus encore...

DIVI intègre parfaitement les services Mailchimp & Aweber, il vous propose également un module SEO, une gestion des Ads et de l'ajout de code...

Parmi les points sympas, la possibilité de créer en 2 clics une vraie "Landing Page" sans header, ni footer, très utile pour promouvoir un produit ou un service.

Les effets Parallax sont également bien pris en compte. Sans oublier des petites choses utiles comme le "Menu fixe", le bouton "Retour en haut", le "Mega-menu"...

Découvrez la vidéo de présentation DIVI2 réalisée par Elegant Themes :

 

Ma conclusion sur DIVI

J'ai toujours eu du mal avec Elegant Themes, je ne suis habituellement pas fan de leurs designs et de leur modèle économique, pourtant je dois bien reconnaître que ce DIVI 2 m'a bluffé!

Le thème est fluide, rapide et le design élégant. Le constructeur de page intégré est réactif, intuitif et surtout sans latence.

J'ai passé 2h00 à jouer avec les pages et les nombreuses options de DIVI, au final je ne regrette pas mon achat (de 67 à 89$ selon licence).

En adjonction à DIVI et toujours chez Elegantthemes, découvrez également l'excellent plugin de partage social Monarch.

 

VOIR LA DEMO ACHETER DIVI

 

 

A propos de l'auteur...

WPFormation

Fabrice Ducarme, formateur WordPress je suis éditeur, auteur et fondateur du site WP Formation.com. Conférencier lors des WordCamp Paris 2013 & 2015 ainsi qu'au WP Tech Nantes 2014, je vous propose plus de 400 articles & tutoriaux à propos de WordPress, mes trucs & astuces mais aussi des coups de gueule...

18 commentaires pertinents à ce jour ;)

  • Loïc B dit :
    Bonjour,
    J’ai craqué pour ce thème il y a quelques mois, vraiment très sympa :)
    J’ai remarqué que votre menu Epanel était en français… contrairement au miens, qui est en anglais. Avez vous fais quelque chose de particulier ?
  • WPFormation dit :
    Salut @Loîc,

    Il suffit d’ajouter les fichiers de traduction FR, pour info ces fichiers seront dispos pour les abonnés de la Newsletter mensuelle WP Formation;)

    Vous pouvez également l’acquérir directement chez wptrads.com.

  • Loïc B dit :
    Merci pour les infos ;) je pensais que c’était des fichiers de traduction officiels.
  • David Valls y Machinant dit :
    Bonjour à vous,

    Merci pour ce partage.

    Suite à cet article, je me pose la question suivante : Les fonctionnalités font parties intégrantes du thème ?

    Si oui, cela posera problème lorsque l’on désire changer de design puisqu’il faudra refaire toutes les pages.

    Dés lors, vaut il mieux se diriger vers des plugin de constructeurs de thèmes ?

    Quels sont vos avis sur la question ?

    Merci

  • WPFormation dit :
    Bonjour ,

    Oui cela fait partie intégrante du thème (certainement compatible avec le constructeur de page d’Elegant Themes). C’est donc un choix mais il est limité aux pages et de facto, sous WordPress nous utilisons d’avantage les articles que les pages.

    Ce problème est également vrai lorsque l’on utilise un thème avec constructeur de page d’accueil (cf: Sahifa;), ou lorsque l’on doit remplacer tous nos shortcodes…

  • Damien dit :
    Salut,
    et Merci pour toutes ces pistes supplémentaires de frameworks et pagebuilders.

    Il est clair que le Divi d’Elegant theme est un super starter, par contre avec une utilisation massive par les uns et les autres de ce type de thèmes n’allons nous pas vers une forte uniformisation du rendu visuel des sites, avec cet « effet de mode du one-page » + flat design, j’ai quand même l’impression de voir du Divi partout ;)

    Un thème avec de fortes qualités certes, mon seul bémol technique par rapport à un de mes besoins actuels est l’impossibilité (semble-t-il, et de façon plus ou moins simple) d’y rajouter ces propres modules : A cette contrainte, je n’ai pour l’instant repéré que le Page Builder by SiteOrigin qui acceptent d’intégrer tout plugin de type widget.

  • WPFormation dit :
    ,

    Oui le risque est grand d’une uniformisation mais… avec un tant soit peu de talent et de créativité, on arrive à se démarquer. Le parallax et/ou le one-page sont proposés dans DIVI mais pas obligatoires;)

    J’ai été, pour ma part, impressionné par le builder et l’ergonomie de DIVI. Si Elegant Theme se met à produire des thèmes de cette qualité, tout le monde y trouvera son compte. Hope and see…

    Ps/ On peut aussi utiliser Visual Composer pour ajouter ses modules.

  • Loïc B dit :
    Merci pour les fichiers de traductions :)
  • WPFormation dit :
    You’re Welcome :)

    N’oubliez pas, pour toutes les traductions de thèmes d’aller faire un tour sur wptrads.com, efficace, bien fait et pas cher!

  • Chris dit :
    Ca fait quelques mois également que j’utilise Divi et c’est vraiment facile à utiliser. A noter que Divi 1 était beaucoup moins bien ficelé. Ils semblent faire beaucoup d’efforts pour améliorer ce thème continuellement.
    Un petit bémol dans l’utilisation excessive à mon gout des marges entres les différents modules. On se retrouve avec des pages (très) longues même avec un faible contenu…
    Ils doivent proposer dans les semaines ou mois à venir un thème du même style, mais plus ciblé articles que pages web. A suivre donc
  • Fred dit :
    Bonjour, quelle est la marche à suivre pour disposer du fichier de traduction français du thème DIVI ? Je me suis inscrit à la newsletter :)
    Merci ^^
  • WPFormation dit :
    Bonjour,
    Pour la traduction il faudra désormais vous la procurer chez WPTrads. Les bonus de la NL WPFormation changent chaque mois, le prochain bonus sera le plugin Monarch ;)
  • Cathy dit :
    Bonjour,
    Selon vos conseils que je suis à la lettre j’ai acheté Divi 2.0 et mis woocommerce pour refondre mon site qui est sous oscommerce et qui devient un peu obsolète (il a 8 ans)
    J’ai des difficultés avec la page des produits et page builder. Il y a peu de tutoriels et du coup je sèche. J’ai déjà fait 2 sites sous wordpress et j’ai aussi prestashop mais rien à voir avec woocommerce. J’habite dans la campagne à côté de Lyon et il m’est difficile de suivre une formation car je ne peux quitter mon poste.
    Bref faites vous des formations à distances ou sur Lyon.
    Bonne soirée.
  • Christophe dit :
    Bonjour Fabrice et bravo pour ton site.
    Je suis étonné de voir que tu fais très peu état de Genesis, ce framework tant connu.
    Je m’en sers personnellement mais j’avoue trouver son utilité assez relative, en fait je ne vois pas bien ce qu’apporte Genesis… Le couple WP+ un thème n’est-il pas suffisant ?
    Pourrais tu me donner ton avis ?
    A+ et merci
  • WPFormation dit :
    merci ;)

    Genesis a ses adeptes et est considéré comme l’un des meilleurs frameworks ! Utiliser un framework permet une plus grande personnalisation, dans les hooks, sur les fonctions, dans la conception et sur les modèles. C’est donc un peu plus technique d’utiliser toutes les possibilités offertes par Genesis.

    Si le couple WordPress + thème convient à tes besoins alors c’est parfait ! D’autres en revanche voudront avoir plus de possibilités…

  • Christophe dit :
    Ok donc en quelque sorte Genesis ajoute une série d’options/personnalisations supplémentaires ?
    Genesis s’intercale entre Wp et le thème c’est bien ça ?
    Faut-il impérativement utiliser un thème compatible Genesis ?
    Merci
Tweet58
Share60
Share12
Buffer85