Sommaire
1. Qu’est-ce qu’un module Divi ?
2. Découvrez les 46 modules Divi
2.1 Accordéon
2.2 Appel à l’action
2.3 Audio
2.4 Barre latérale
2.5 Bascule
2.6 Blog
2.7 Bouton
2.8 Carte
2.9 Barre de Recherche
2.10 Code
2.11 Commentaires
2.12 Compteurs barre, cercle et à chiffre
2.13 Compte à rebours
2.14 Curseur de défilement de post
2.15 Curseur de défilement Vidéo
2.16 Diaporama
2.17 Email
2.18 Formulaire de contact
2.19 Galerie
2.20 Image
2.21 Navigation dans les posts
2.22 Onglets
2.23 Personne
2.24 Portefeuille et Portefeuille Filtrable
2.25 Résumé
2.26 Connexion
2.27 Réseaux sociaux
2.28 Séparateur
2.29 Tableau des tarifs
2.30 Textes
2.31 Titre du Poste
2.30 Témoignages
2.31 Vidéo
Le thème builder possèdent 46 modules Divi permettant de personnaliser au maximum vos différentes pages de votre site. Ce qui permet de pallier aux différentes limites de Guttenberg de WordPress, qui, malgré les mises à jour, reste limité en termes de personnalisation.
Qu’est-ce qu’un module Divi ?
Le constructeur de page de Divi est organisé en plusieurs blocs : les sections, les lignes et les modules Divi. Selon la section choisie vous aurez différents modules. C’est le cas des sections Plein Écran et les sections Normal et Spécifique.
En effet, la première section « Plein Écran » permet d’utiliser 9 modules Divi que nous allons détailler un peu plus bas dans l’article.
Carte plein écart
Code en pleine largeur
Curseur de défilement de post pleine largeur
Curseur de défilement plein écran
En tête plein écran
Image pleine largeur
Menu plein écran
Portefeuille plein écran
Titre du poste en pleine largeur
Les différentes sections sur Divi Builder
.menu_cta a {
background: #bd1d8b;
border: 2px solid #bd1d8b;
border-radius: 4px;
color: #ffffff !important;
text-color: #ffffff;
cursor: pointer;
line-height: 1.7em;
margin: 4px auto;
padding: 8px 15px !important;
transition: all 0.2s ease 0s;
text-transform: none;
}
.menu_cta a:hover{
background-color: #18f2b2;
}
/* text CTA en blanc apres scroll */
.et-fixed-header #top-menu .menu_cta > a {
color: #ffffff !important;
background-color: #bd1d8b;}
.et-fixed-header #top-menu .menu_cta > a:hover{
background-color: #ffffff;}
#page-container .et_pb_button_0:before{
color:#ffffff;}
#et-top-navigation {
font-weight: bold;}
Les 9 modules Divi pour la section Plein Écran
Les modules proposés par Divi pour le plein écran permet de réaliser des sections originales et est très pratique pour des Hero sections en pleine largeur.
Concernant les deux autres sections, le thème builder Divi comptabilise plus d’une trentaine de modules. De quoi faire parler sa créativité et rendre la création de site amusante et design. Mais pas que, beaucoup de modules de Divi vous permettrons de créer des pages engageantes d’un point de vue marketing.
Attention, si vous ne possédez pas le thème builder Divi, vous ne pourrez pas utiliser les modules. En effet, vous devez téléverser le plugin sur votre site. Le thème Divi ne vous le permettra pas.
Si vous ne savez quelle est la différence entre le plugin Thème Builder Divi et le Thème Divi, nous vous invitons à lire cet article » La différence entre le thème Divi et le Thème Builder ? «
Découvrez les 46 modules Divi
Parce qu’une image vaut mille mots (pas vraiment sûr de l’expression), nous allons vous détailler les 46 modules de Divi en vous donnant des exemples de réalisations. Pour vous y retrouver, nous allons les aborder par ordre croissance. Aller, c’est parti !
Module Divi n°1 : Accordéon
Nous utilisons Accordéon pour créer des FAQ originales. L’utilisateur va cliquer pour découvrir un texte ou une image. Vous pourrez le personnaliser à votre guise en respectant votre charte graphique.
Je suis un module Accordéon
Comme pour le module Bascule, je vous aide à réaliser des FAQ en deux minutes chronos et personnalisables à souhait !
Clique ici
Tadaaaaaaam ! ?
Module Divi n°2 : Appel à l’action
L’appel à l’action est idéal pour inciter vos utilisateurs à s’inscrire à votre super newsletter, ou à télécharger votre E-book. Bien plus qu’un simple Bouton, il vous aidera à générer plus de cliques (s’il est bien conçu).
L'appel à l'action ?
Argumentaire pour convaincre de cliquer sur ton incroyable bouton CTA.
Module Divi n°3 : Audio
Si vous avez besoin de faire écouter vos audios, c’est parfait. Vous avez la possibilité de le choisir l’url ou de le téléverser directement sur votre site.
CO2
CO2 by airtone (c) copyright 2014 Licensed under a Creative Commons Attribution Noncommercial (3.0) license. http://dig.ccmixter.org/files/airtone/46780/
Module Divi n°4 : Barre latérale
La barre latérale peut être utilisé pour afficher différents widgets, les derniers articles consultés, ou encore l’inscription à une newsletter.
Module Divi n°5 : Bascule
Il possède les mêmes caractéristiques que l’Accordéon à la différence est qu’il agit seul.
Je suis le module Bascule
Hello ?
Module Divi n°6 : Blog
Utilisez le module Blog, pour afficher vos articles, vous pouvez personnaliser les encarts, en choisissant d’afficher ou non les différents éléments comme les métadonnées, la date, l’auteur ainsi que le format en grille ou en plein page.
Hop et nous en profitons pour vous conseiller nos deux derniers articles.
La différence entre le thème Divi et le Thème Builder ?
Si vous débutez avec Divi, vous vous demandez sûrement quelle est la différence entre le thème Divi et le thème builder. Quand nous avons commencé notre aventure avec Divi, nous nous sommes retrouvés face à cette problématique. Après quelques recherches, et quelques...
Ajouter une carte Google Maps sur Divi, gratuitement et sans l’API
Ajouter une carte Google Maps sur Divi sans API et gratuitement est un jeu d'enfant. En effet, depuis 2018, Google demande de fournir un moyen de paiement. Si l'entreprise dépasse les quotas d'affichages, 28000 par jour, elle se verra prélever directement. Pour...
Module Divi n°7 : Bouton
Module Divi n°8 : Carte
Le module Carte peut être très interressant si vous souhaitez donner la localisation exacte de votre lieu de travail, magasin restaurant.
Si vous souhaitez avoir Maps gratuitement, suivez ce tutoriel.
Module Divi n°9 : Chercher / barre de recherche
Idéal si vous souhaitez que vos utilisateurs aient accès à l’information rapidement.
Module Divi n°10 : Code
Si vous devez ajouter du code, nous vous conseillons de l’utiliser. Le module vous permettra d’écrire en HTML, JavaScript et bien d’autres langages.
Module Divi n°11 : Commentaires
Si vous avez un blog ajoutez le module commentaire pour permettre aux utilisateurs de commenter vos articles et ainsi créer du lien avec eux.
Module Divi n°12 : Compteur barre, cercle et à chiffre
Si vous souhaitez mettre en valeur des chiffres utilisez les modules compteurs.
- DIVI 100%
- Elementor 80%
- WP-Bakery 50%
%
Divi
%
Elementor
%
WP-Bakery
%
Divi
%
Elementor
%
Wp-Bakery
Module Divi n°15 : Compte à rebours
Utilisez le module compte à rebours si vous souhaitez proposer une offre dans le temps par exemple, ou l’ouverture prochaine d’un magasin.
Compte à rebours
Jour(s)
:
Heure(s)
:
Minute(s)
:
Seconde(s)
Module Divi n°16 : Curseur de défilement de post
Autre manière de présenter vos articles de blog, le curseur de défilement de post vous permet d’afficher les post de vos articles. Vous pouvez choisir les différentes catégories à afficher, le titre, l’auteur et d’autres paramètres.
Module Divi n°16 : Curseur de défilement de post
Autre manière de présenter vos articles de blog, le curseur de défilement de post vous permet d’afficher les post de vos articles. Vous pouvez choisir les différentes catégories à afficher, le titre, l’auteur et d’autres paramètres.
0 commentaires