Les modules Divi

15 Mar 2022 | Uncategorized

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 modules Divi

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 modules Divi
Les modules Divi

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 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.

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.

  • DIVI100%100%
  • Elementor80%80%
  • WP-Bakery50%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

Day(s)

:

Hour(s)

:

Minute(s)

:

Second(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.

Divi 5

Les modules Divi

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…

Créer un Slider plein écran avec Divi

Le module Curseur de Défilement également appelé Slider en anglais apporte de nombreuses fonctionnalités comme l’utilisation de l’effet parallaxe ou de vidéo en arrière plan. En s’inspirant du module En-tête plein écran, nous allons voir ici comment…

Thème enfant pour Divi

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.

Si vous avez des questions, n’hésitez pas à commenter ci-dessous ou rejoindre notre groupe Facebook 😉

Accéder à des contenus exclusifs sur Divi

Inscrivez-vous à la Newsletter et profitez de contenus exclusifs sur le thème et le builder DIVI

Submit a Comment

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *