DIVI propose à ce jour 46 modules, c’est-à-dire 46 objets précodés que vous pouvez ajouter facilement à vos pages et personnaliser à volonté. Nous avons vu dans les articles précédents les 15 premiers modules Divi puis les 16 suivants dans le détail, voici ci-dessous les derniers.
SOMMAIRE
01- Accordéon
02- Appel à action
03- Audio
04- Barre latérale
05- Bascule
06- Blog
07- Boutique
08- Bouton
09- Carte
10- Chercher
11- Code
12- Commentaires
13- Compteur Barre
14- Compteur Cercle
15- Compteur Nombre
17- Curseur de défilement des Posts
18- Curseur défilement Vidéo
19- Diapo
20- Email Optin
21- Formulaire de Contact
22- Galerie
23- Image
24- Navigation dans les Posts
25- Onglets
26- Personne
27- Portefeuille
28- Portefeuille Filtrable
29- Résumé
30- Se connecter
31- Suivez-nous sur les Réseaux Sociaux
32- Séparateur
33- Tableau des Tarifs
34- Texte
35- Titre du Poste
36- Témoignage
37- Vidéo
38- Carte en Plein Écran
39- Code en Pleine Largeur
40- Curseur de défilement des Posts pleine largeur
41- Curseur défilement pleine largeur
42- Entête Plein Écran
43- Image en Pleine Largeur
44- Menu Plein Écran
45- Portefeuille Plein Écran
46- Titre du Post en plein écran
32- Séparateur
Le module Séparateur permet d’ajouter une ligne entre deux modules. Le séparateur peut être invisible et dans ce cas il devient un moyen de créer un espace. S’il s’agit d’une ligne, vous pouvez choisir son style (ligne pleine, pointillé, tirets, double,…), son épaisseur, sa largeur, la marge au dessus et en dessous, et comme pour tous les autres modules Divi les effets, ombres, animation etc…
33- Tableau des Tarifs
Ce module permet d’afficher des tarifs, mais ça, on l’avait un peu deviné. Chaque zone de texte est préparée pour vous permettre de saisir vos informations et totalement personnalisable. Choisissez votre monnaie, renseignez les champs souhaités et stylez chaque bloc indépendamment des autres. Vous pouvez également mettre en avant un élément si vous le souhaitez (ici, le 2ème).
Produit 1
Abonnement mensuel- Votre texte explicatif ici
Produit 2
Abonnement semestriel- Votre texte explicatif ici
Produit 3
A l'unité- Votre texte explicatif ici
34- Texte
Que dire sur ce module si ce n’est que c’est celui que vous allez utiliser le plus ! Il vous permet de retrouver tous les outils de mise en forme de texte et de personnaliser votre bloc avec tous les styles de fond, de bordure, de typographie et de couleurs que propose DIVI.
35- Titre du Poste (= titre de l’article)
Cette mauvaise traduction peut induire en erreur : en réalité, il faut lire « Post » et non « Poste », et l’on parle donc bien d’un module qui permet d’afficher le titre de l’Article ou de la Page en cours d’affichage. Mais il fait bien plus que cela : vous pouvez afficher un grand nombre de données liées à ce « Post » : les métadonnées (c’est-à-dire les infos sur l’auteur, la date de publication, la ou les catégories, le nombre de commentaires), l’image mise en avant (et régler son positionnement par rapport au texte). Voici un exemple :
Les modules DIVI à votre disposition Partie 3/3
36- Témoignage
Là aussi, un élément préparé pour vous pour afficher un témoignage de client. Changez le contenu, ajouter un portrait ou un avatar, faites vos réglages de styles, bref : amusez-vous !
Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.
37- Vidéo
Même si je ne recommande pas d’insérer une vidéo avec le module Divi*, il permet toutefois de faciliter grandement le travail et de bénéficier de toutes les possibilités de styles et d’animations que propose tout module Divi.
* Une vidéo étant généralement un fichier très lourd, je vous recommande de ne pas téléverser directement votre vidéo dans la bibliothèque de médias mais de l’héberger puis de l’insérer à partir du lien généré par un service de streaming comme YouTube, Dailymotion ou autre. Par ailleurs, veillez à proposer à vos visiteurs le choix d’activer ou non les cookies de ce services, le RGPD vous l’impose. Pour plus d’explications, lisez cet article : Insérer une vidéo dans un article.
38- Carte en Plein Écran
Le module Carte en plein écran vous permet d’afficher une carte Google Map en plein écran. Il ne s’insère que dans une section violette de Divi contrairement au module Carte qui s’intègre dans une section bleue.
Attention : pour faire fonctionner Google Map, vous devez avoir une adresse de messagerie Gmail pour vous inscrire sur Google Cloud Platform et vous devez obtenir une clé API pour faire fonctionner ce module.
>> Accédez à Google Cloud Platform pour obtenir votre API Key
>> Découvrez la documentation de Divi sur l’obtention d’une API Key (en anglais)
Pour les réfractaires à Google, il existe des extensions qui appellent les cartographies opensource comme OpenStreetMap.
39- Code en Pleine Largeur
Le module Code en Pleine Largeur est l’équivalent du module Code à ceci près qu’il ne pourra être intégré que dans une section violette pour occuper toute la largeur de la zone d’affichage (voir les explications sur le module Code).
40- Curseur de défilement des Posts pleine largeur
Le module Curseur de défilement des Posts pleine largeur est l’équivalent du module Curseur de défilement des Posts à ceci près qu’il ne pourra être intégré que dans une section violette pour occuper toute la largeur de la zone d’affichage.
Il permet donc de créer un diaporama d’articles (voir les explications sur le module Curseur de défilement des Posts).
41- Curseur défilement pleine largeur
Le module Curseur défilement pleine largeur est l’équivalent du module Diapo à ceci près qu’il ne pourra être intégré que dans une section violette pour occuper toute la largeur de la zone d’affichage.
Il permet donc de créer un diaporama (voir les explications sur le module Diapo).
42- Entête Plein Écran
Ce module vous permet de créer une section d’entête originale, en pleine largeur et avec de nombreuses possibilités : présence d’une image et de boutons d’action, et toutes les variations de styles et d’animation proposées par Divi.
43- Image en Pleine Largeur
Le module Image en Pleine Largeur est l’équivalent du module Image à ceci près qu’il ne pourra être intégré que dans une section violette pour occuper toute la largeur de la zone d’affichage (voir les explications sur le module Image).
44- Menu Plein Écran
Le module Menu Plein Écran vous permet d’insérer un menu de navigation dans n’importe quelle zone de votre structure.
Il s’intègre exclusivement dans une section violette pour occuper toute la largeur de la zone d’affichage.
Créez le contenu de votre menu dans votre Tableau de Bord > Apparence > Menus et appelez-le ensuite dans votre module Divi. Combiné avec l’excellent outil Theme Builder de Divi (qui permet de créer des patrons de pages, d’entêtes ou pieds de page), il offre la possibilité de personnaliser totalement votre système de navigation.
45- Portefeuille Plein Écran
Le module Portefeuille plein écran est l’équivalent du module Portefeuille à ceci près qu’il ne pourra être intégré que dans une section violette pour occuper toute la largeur de la zone d’affichage (voir les explications sur le module Portefeuille).
46- Titre du Post en plein écran
Le module Titre du Post en plein écran est l’équivalent du module Titre du Post à ceci près qu’il ne pourra être intégré que dans une section violette pour occuper toute la largeur de la zone d’affichage (voir les explications sur le module Titre du Post).