Dynamiser son blog en utilisant les différents formats de publication avec Divi

Vous vous êtes déjà demandé comment ajouter un peu de “peps” et de dynamisme à votre page blog ? Comment varier le format de publication, et mettre une vidéo en avant plutôt qu’une image, par exemple ? Bonne nouvelle, Divi prend en charge le format de publication pour la vidéo, l’audio, les liens, les citations et même les galeries d’images ! Cela veut dire qu’au lieu d’afficher une simple image sur la miniature de votre article, vous allez pouvoir intégrer une vidéo, un slide, une URL, une piste audio ou encore une citation !

Qu'est-ce qu'un format de publication ?

On appelle “format de publication” la mise en page qui s’applique à un article. Le format de publication par défaut affiche une image (statique) comme dans l’exemple ci-dessous :

Les 6 différents formats de publication

WordPress et Divi prennent en charge 6 mises en page d’article différentes. Le mieux est de visualiser en image ce que ça donne :

Sympa, non ?

Mais pour utiliser ces différentes mises en page sur ton blog, il y a quelques astuces à connaître. C’est justement ce que WP Zen vous propose de découvrir dans ce tutoriel 😉

Utiliser les différents formats de publication avec WordPress et Divi

L'encart "format"

En écrivant un article de blog dans votre site wordpress, vous avez peut-être déjà remarqué un encart appelé “Format” (voir la capture d’écran ci-contre), à droite de votre éditeur de texte. Cet encart contient, sous forme de liste, les 6 options de format de publication possibles. Le choix de format “standard” (ou “par défaut“) affichera votre article de blog au format basique (c’est à dire avec une image statique), tandis que chaque option intégrera un design unique associé au type de format choisi.

NOTE : pour voir l’encart “format” et utiliser les différents formats d’article, il faut passer par l’éditeur WordPress. C’est à dire qu’il faut laisser tomber le Visual Builder de Divi, et rédiger son article en passant par le tableau de bord WordPress.

” Je suis bien en train de rédiger mon article en passant par le tableau de bord WordPress mais je ne vois pas l’encart “Format” à côté de l’éditeur de texte ?! “

Pas de panique. Si l’encart format n’apparaît pas comme sur la capture d’écran ci-dessous, il suffit simplement de l’activer dans les options de l’écran.

Activer le format de publication dans les options de l'écran

Parfois, WordPress permet de masquer ou a contrario d’afficher certaines options pour éviter d’alourdir le visuel de l’utilisateur. Pour afficher un encart qui ne serait pas visible, repérez le bouton “options de l’écran” en haut à droite de la page de rédaction de votre article.

Cliquez sur la flèche pour dérouler les options. La liste des encarts disponibles s’affiche. Repérez l’option “Format” et cochez-la. L’encart “format” doit maintenant apparaître en dessous de l’encart “publier” :

Utiliser le format de publication Vidéo

En sélectionnant le format de publication vidéo, une vidéo s’affiche en haut de l’article à la place de l’image dans le format par défaut. La vidéo intégrée à l’article remplace également l’image miniature de ce dernier.

Pour utiliser le format de publication “Vidéo”, sélectionnez le format approprié comme dans la capture d’écran ci-contre.

Il faut ensuite ajouter une vidéo à votre article. Divi utilisera automatiquement la première vidéo de votre post pour alimenter le design du format vidéo. Pour ajouter une vidéo à votre article, il suffit de saisir l’URL vimeo ou youtube de la vidéo à incorporer dans l’éditeur de texte, ou bien d’utiliser le bouton « Ajouter un média » pour télécharger et intégrer votre propre vidéo :

ATTENTION : malheureusement, il n’est pas possible d’utiliser les différents formats de publication lorsqu’on rédige un article avec le Générateur Divi. Il va donc falloir choisir entre l’utilisation du Divi Builder et un format d’article spécifique. Si vous avez déjà activé le Générateur Divi sur votre article et que vous souhaitez utiliser un format de publication autre que celui par défaut, il faudra repasser par la mise en page par défaut de WordPress en cliquant sur le bouton approprié (voir la capture d’écran ci-dessous). Evidemment, cela vous fera perdre votre mise en page Divi. A utiliser donc avec prudence. Il n’est pas possible d’utiliser à la fois un format de publication spécifique ET le Divi Builder ; c’est donc à vous de choisir ce qui est le plus important pour vous !

Utiliser le format de publication Audio

En sélectionnant le format de publication audio, une piste audio s’affiche en haut de l’article à la place de l’image dans le format par défaut. La piste audio intégrée à l’article remplace également l’image miniature de ce dernier.

Pour utiliser le format de publication “Audio”, sélectionnez le format approprié comme dans la capture d’écran ci-dessous :

Il faut ensuite ajouter une piste audio à votre article. Divi utilisera automatiquement la première piste audio de votre post pour alimenter le design du format audio. Pour ajouter un son à votre article, il faut cliquer sur le bouton “Ajouter un média” en haut à gauche de l’éditeur de texte (voir la capture d’écran ci-dessous) :

Il n’est pas possible de lier l’url d’une piste audio comme on peut le faire pour une vidéo à partir de Youtube ou de Vimeo par exemple. Il faut donc ajouter sa propre piste audio en la chargeant dans le site.

Une fois la bibliothèque de médias ouverte, cliquez sur “Créer une liste de lecture audio” dans le menu gauche.

Cliquez sur le bouton “choisir des fichiers” pour sélectionner un son qui se trouve sur votre ordinateur.

Patientez le temps que la piste audio se charge sur le site, puis cliquez sur le bouton “Créer une nouvelle liste de lecture” en bas à droite.

Sur la droite, vous pouvez effectuer quelques réglages comme par exemple, décider d’afficher ou non l’illustration, la liste des pistes et le nom de l’artiste/auteur de la bande son. Cliquez ensuite sur le bouton bleu “Insérer une liste de lecture“.

La piste audio apparaît dans votre article. Vous n’avez plus qu’à l’enregistrer et à admirer le résultat sur votre site !

Utiliser le format de publication Citation

En sélectionnant le format de publication citation, une citation stylisée s’affiche en haut de l’article à la place de l’image dans le format par défaut. La citation intégrée à l’article remplace également l’image miniature de ce dernier.

Pour utiliser le format de publication “Citation”, sélectionnez le format approprié comme dans la capture d’écran ci-dessous :

Il faut ensuite ajouter une citation à votre article. Divi utilisera automatiquement la première citation de votre post pour alimenter le design du format citation. Pour ajouter une citation à votre article, il suffit de taper la citation dans l’éditeur de texte, puis de surligner la portion, et de cliquer sur la commande “citation” dans la barre d’outils (voir la capture d’écran ci-dessous) :

Utiliser le format de publication Galerie

En sélectionnant le format de publication galerie, une succession d’images s’affiche en haut de l’article à la place de l’image dans le format par défaut. La galerie d’images intégrée à l’article remplace également l’image miniature de ce dernier par un slide (images défilantes).

Pour utiliser le format de publication “Citation”, sélectionnez le format approprié comme dans la capture d’écran ci-dessous :

Il faut ensuite ajouter des images à votre article. Divi utilisera automatiquement la première galerie d’images de votre post pour alimenter le design du format galerie. Pour ajouter une galerie d’images à votre article, il faut cliquer sur le bouton “Ajouter un média” en haut à gauche de l’éditeur de texte (voir la capture d’écran ci-dessous) :

Une fois la bibliothèque de médias ouverte, cliquez sur “Créer une galerie” dans le menu gauche.

Cliquez sur l’onglet “téléverser des fichiers” pour ajouter des images sur votre site si elle n’y sont pas déjà. Autrement (ou une fois fait), positionnez-vous sur l’onglet “Bibliothèque de médias“, et sélectionnez les images que vous souhaitez intégrer à votre galerie en cliquant simplement dessus (voir la capture d’écran ci-dessous). Une fois sélectionnées, les images présentent une croix dans leur coin droit.

Cliquez sur le bouton “créer une nouvelle galerie” pour ajouter la galerie à votre article.

Sur la droite, vous pouvez effectuer quelques réglages d’affichage selon vos préférences. Cliquez ensuite sur le bouton bleu “Insérer la galerie“.

La galerie d’images apparaît dans votre article. Vous n’avez plus qu’à l’enregistrer et à admirer le résultat sur votre site !

Utiliser le format de publication Galerie

En sélectionnant le format de publication lien, un lien stylisé s’affiche en haut de l’article à la place de l’image dans le format par défaut. Le lien intégré à l’article remplace également l’image miniature de ce dernier.

Pour utiliser le format de publication “Lien”, sélectionnez le format approprié comme dans la capture d’écran ci-dessous :

Il faut ensuite ajouter un lien à votre article. Divi utilisera automatiquement le première lien de votre post pour alimenter le design du format lien. Pour ajouter un lien à votre article, il suffit de coller l’url du lien dans l’éditeur de texte, puis de le surligner, et de cliquer sur la commande “insérer/modifier un lien” dans la barre d’outils (voir la capture d’écran ci-dessous) :

Recollez le lien dans la boîte de dialogue qui apparaît, et cliquez sur le bouton bleu “Appliquer”. La roue à côté permet d’ajuster quelques réglages pour le lien selon vos préférences.

C’est tout pour cet article ! On espère qu’il vous a plu et vous a permis de mettre un peu de vie sur votre blog 😉 N’hésitez pas à les poser en commentaires si vous avez des questions !