Les modules DIVI à votre disposition Partie 3/3

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.

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

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

par | Mai 30, 2019 | Les tutoriels DIVI | 0 commentaires

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.

Le nom va ici

Poste dans l'entreprise, Société

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

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

Pin It on Pinterest