The "Publish Content" module: how to use it within a theme template?

Updated on 19/11/2019 | Published on 12/11/2019 | 24 comments

The module "Publish Content" (or Post Content) is available from the version 4.0 of the Divi theme. Maybe you haven't used it yet? Maybe you don't see what it's for either?

Perfect, you've come to the right place!

You will see that this module is essential in half of the cases of creation of templates with the Divi Theme Builder. And also, that it is unusable in the other half....

You will also discover all its configuration options....

Advertisement: This article contains affiliate links that you will easily recognize. The classic links are in purple and sponsored links are in pink.

1 - What is the purpose of the "Publish Content" module (or Post Content) of Divi?

This feature was expected from the ground up and it's finally possible!

The module "Publish Content (Post Content) allows you to stylize once and for all the content part (the body) displayed within your pages and articles. No matter what this content was created with: with the Visual Builder or with the WordPress editor (classic or Gutenberg)...

In the past, it was necessary to add CSS to stylize all the titles of a site for example...

That's right, because the tab Appearance > Customize > General Settings > Typography does not allow you to choose a custom font for the different title tags (h1, h2, h3, etc.).

Nor can the colours be differentiated by type of title.

You can only choose one font size for the body of the text and another for the header titles, the same for the typography...

That time is over! Now, the "Publish Content" module (Post Content Module) allows you to style all the HTML elements of your content.

Thanks to it, you will define the size, color, spacing, typography, responsible versions, box-shadow, animation and more of the following elements:

  • The titrations h1, h2, h3, h4, h5 and h6,
  • Quotation blocks,
  • Hypertext links,
  • The images,
  • The bulleted lists,
  • The numbered lists,
  • The whole body (body).

But don't worry, the settings options will seem familiar to you because nothing changes at that level.

2 - Where can the "Publish Content" module be used?

To start, don't look for the module Publish Content within the Visual Builder, the one you use within the page or article to build your layout. It is simply not available here.

And that's normal, it can only be used within the Divi Theme Builder!

Since it is used to dynamically style your entire site, it must be used within the theme templates.

But not just any theme template! On some, the Post Content module will be essential, on others, it will be useless!

Basic, this module is really useful - and even essential - on article templates and page templates... But you can use it on other types of templates...

Let's take a closer look:

Templates pour module Publier un Contenu (Post content)
Authorized templates for Post content module

You will be able to use the Publish Content module on:

  • Pages: All pages, Homepage, Specific Page, Children.
  • Articles : All articles, Articles in specific categorory, aricles with specific label, specific articles.
  • WooCommerce Pages: cart, checkout, my account.
  • Projects : All projects, Projects in specific categories of projects, Projects with specific project tags, specifict projet.

The module Publish Content will be useless on:

Don't delay any longer! Discover the Divi theme here !

3 - How to insert it in a theme template?

The insertion of the module Publish Content module within a theme template is identical to the insertion of any type of module...

Ajouter un nouveau modèle
Click on "Add new template

Go to the tab Divi > Theme Builderclick on "Add a new template" (Add New Template) and choose the type of template to create.

We have just seen it, it can be a template for all your articles or pages, a template for articles classified in a certain category etc.

You will then enter the edition (construction) of your template (model): you can create it from scratch or you can use a layout in your library (discover how to import/export a theme template).

For this example (screenshot below), I create the model (template) from scratch.

Module Publier un Contenu
Insert the "Publish Content" module into the template of your choice
  1. In the template editor,
  2. Add a new row (in green). 1/1 composition is recommended.
  3. Then click on "+" to insert a new module.
  4. Select the module "Publish Content" (Post Content).
Apparence du module Post Content
Appearance of the Post Content module

Once inserted, the Publish Content module looks like the screenshot above.

No need to wonder what this text corresponds to and to tell you that you have never written it... It's normal: it's a dynamic text.

Any changes made here will apply to all content using this template template. And that's the most interesting thing!

4 - How to customize the Post Content module?

Once you have inserted this famous module into your template, all you have to do is modify it...

To do this, click on the gearwheel icon that appears when the mouse hovers over it.

Paramètres module Post Content
Configure the settings of the Post Content module

A window will open and offer you a lot of options.

Even if you already think you know them all, believe me, I still discovered some of them when I created this tutorial! Like what, when you take the time to look into the details, you always find interesting things!

Let's look at all this in detail....

4.1 - Content tab

When the popup opens, the Content tab is present by default.

Onglet Contenu - Fond
Content tab

Nothing very complicated here. You will only be able to change the background color of the Post Content module (the color of the main content).

4.2 - Style tab

The Style tab is where most of the design options are located.

Post Content : Onglet Style
Post Content: settings available in the Style tab

Here you will find the following "sub-tabs":

  1. Image
  2. Text
  3. Text Subtitle
  4. Sizing and sizing
  5. Spacing
  6. Border
  7. Shade box
  8. Filter
  9. Transforming
  10. Animation

Each of these tabs provides options to style the elements in question... All the choices you make here will apply to all the pages of your site that use this template (theme template).


The Image sub-tab

Here, you will configure the design of all the images inserted in your content.

For example, you may want to

  • Round off the angles,
  • add a border,
  • choose the thickness of the border,
  • change the color of the border,
  • add a shadow to your image.
Onglet Style - Image
Style tab > Image

The Text sub-tab

Here, you will define the design of the different texts of your content.

Not only will you define the body of the text but also the hyperlinks, bulleted lists, numbered lists and quotation blocks.

For each of these elements, you can modify the typeface, style, color, alignment, spacing, line height, shadow, etc.

But above all, you can define different values depending on the screen sizes. This is ideal to improve the responsiveness of your site.

Onglet Style - Texte
Style tab > Text

The Text Sub-Title Sub-Title Sub-Title

Well, I grant you, the EN-FR translation is not great (see here how to get a well translated Divi)…

The "Subtitle text" tab allows you to style all titles.

As with classic text, you can define a typeface, size, alignment, color, etc. for each type of title.

Do not forget to select each title in order to customize it (h1, h2, h3 etc.).

Also remember to make your adjustments according to the size of the screens (desk, tablet, telephone).

Onglet Style - Texte Sous Titre
Style tab > Text Under Title

The Dimensioning sub-tab

Here, nothing too hard, you can define a width and height for your content, whether it is in a mobile, tablet or desktop version.

It would be better to leave the default values.

Onglet Style - Dimensionnement
Style tab > Sizing

The Spacing sub-tab

The spacing sub-tab allows you to add Margin (Margin) and Padding (Internal Margin) to all your content.

You can also define these values according to the size of the screens.

Onglet Style - Espacement
Style tab > Spacing

The Border sub-tab

The border you define here will apply to the entire content area.

You can define rounded angles, border style, thickness and color.

Onglet Style - Bordure
Style Tab > Border

The Filter subtab

I have rarely used this option....

It allows you to add a color filter or opacity to your content.

It may be interesting on an image for example, but on the whole content, it seems to me that it is not optimal.

Onglet Style - Filtre
Style tab > Filter

The Shadow Box sub-tab

If you add a shadow, it will apply to the "box" of your content.

Onglet Style - Ombre
Style Tab > Shadow

The Animation sub-tab

Same for the animation, it will apply to the "box" of your content.

Onglet Style - Animation
Style tab > Animation

Did you know that you can test Divi for free? Go to this page and click on "TRY IT FOR FREE"

4.3 - Advanced tab

The Advanced tab allows you to go a little further in the design.

This is ideal if you want to add IDs or CSS classes that you will later call from your children's theme or from the Appearance tab > Customize > Additional CSS.

Post Content : onglet avancé
Post Content: settings available in the advanced tab

Here you can:

  1. Add an ID and/or a CSS class.
  2. Add CSS code directly within the module.
  3. Define visibility: it is ideal for enabling or disabling elements depending on the size of the screens. However, here, it will be on the Post Content module as a whole that you will act.
  4. Modify transitions (duration and delay).

5 - In conclusion....

With this new module Publish Content (Post Content), we can finally define the overall design of a site or a template file in no time at all.

We do it once and for all and it saves us a lot of time!

But what is most appreciated is that we can easily respect the guide styles a graphic charter!

To get started with Divi, discover all the articles to start serenely!

Module Publier un Contenu (Post Content) de Divi
Utilisation du module Post Content (module Publier un Contenu)
How to use Divi Post Content Module

1,728 words

7

You should like it too:

Formation Divi PDF : un guide pas à pas

Divi PDF training: a step-by-step guide

What better than a Divi PDF training to master this WordPress Theme, its Visual Builder and its Theme Builder? It's as if a trainer invited himself in your home... Discover its content!

24 Commentaires

  1. Guillaume

    Merci pour cet article très complet !!

  2. DavidArles

    Merci beaucoup Lycia!

  3. Christophe

    Bonjour Lycia,

    Je vous remercie pour la séance de coaching qui a été très bénéfique.

    J’ai testé ce soir « Le Module Post Content : comment l’utiliser au sein d’une template de thème ? » sur mon site de test.

    J’ai quelques premières remarques :

    J’ai cherché le module « Post content » et j’ai pris par inadvertance le module « Titre de Post » car je ne voyais pas du tout en bas le module « Post content » comme sur vos images écrans…. même après une sélection Choix « Post »
    Le résultat est que tout le texte de mes pages n’est plus apparu…

    J’ai insisté, et j’ai noté l’icône à côté de « Post Content » sur votre image écran.
    J’ai cherché le module qui correspondait à cette icône, et finalement sur ma version DIVI (la dernière 4.0.6), cela correspondait à « Publier un contenu » !

    Et là, j’ai bien retrouvé le texte dynamique dans l’image en paragraphe 3 !

    Par contre, je n’ai pas encore trouvé la bonne manipulation pour copier le layout de mes pages et le copier dans le template de thème.
    Ce serait dommage de partir de zéro dans le template.

    A suivre.

  4. Lycia Diaz

    Bonsoir Christophe et merci pour votre confiance. Ce tuto date de la semaine dernière et entre temps, ils ont dû modifier quelques traductions je suppose ?
    Concernant le layout le vos pages, si vous parlez du contenu lui-même, il sera « retranscrit » par défaut grâce au module Post Content (qui a apparemment changé de nom 😉 )
    Normalement, vous n’avez rien à faire car ce fameux module fait appel au contenu de vos pages ou articles, tout dépend sur quel type de template vous l’utilisez.
    Donc pour récapituler : vous créez une template de page ou article, par exemple, via le thème builder et vous ajoutez le module « Post Content » ou « Publier un contenu » … et c’est tout. Le reste du boulot se passe au sein de votre page (ou article) avec ou sans le Visual Builder. Donc, le contenu de vos pages (ou articles) continu de se créer au sein de celles-ci.
    Je ne sais pas si je suis assez claire ? 😉

  5. JLuc

    Bonjour Lycia,
    Je n’ai pas le module « Publier un contenu » dans ma version de Divi.
    Je n’ai pas non plus les modules ci-dessous que tu sites ici https://astucesdivi.com/liste-modules-divi/
    Module Carte en Plein Écran
    Module Code en Pleine Largeur
    Module Curseur de défilement des Posts pleine largeur
    Module Curseur défilement pleine largeur
    Module Entête Plein Écran
    Module Image en Pleine Largeur
    Module Menu Plein Écran
    Module Portefeuille Plein Écran
    Module Titre du Post en plein écran

  6. JLuc

    Je rectifie ma question car j’ai trouvé une partie de la réponse. En fait, les modules 38 à 46 ne sont utilisables que pour les sections pleine écran.
    Par contre, toujours pas de trace du module « Publier un contenu » 🙁

  7. Lycia Diaz

    Salut Jean Luc ça va ? Alors, mon article explique bien que certains modules sont disponibles dans certaines sections uniquement. C’est bien le cas et c’est noté que les modules 38 à 46 sont uniquement dans les sections violettes. Donc tu as trouvé finalement 😉 Concernant le module Publier un contenu il n’est pas disponible dans le Divi Builder. C’est un module spécifique du Thème Builder … tu ne le trouves qu’à cet endroit. Un article spécial est dédié à ce module : https://astucesdivi.com/module-post-content/
    Voilà, j’espère t’avoir éclairé 😉

  8. Glao

    Bonjour Lycia et merci pour tous ces tutos très appréciables pour la très très débutante que je suis.
    J’essaie de créer mon blog de cuisine avec wordpress et divi.
    Dans le thème builder de divi, j’ai bien compris qu’il fallait installer le module « publier un contenu » dans le « corps personnalisé » et je l’ai fait.
    En dessous j’ai créé tout ce que je désire dans le corps de tous mes articles, c’est à dire une rangée verte avec à l’intérieur un module noir avec trois images puis une autre rangée verte avec à l’intérieur un module noir de texte puis une autre rangée verte avec à l’intérieur un module noir de deux images etc …
    Sauf que quand je vais dans la création de mon article j’ai toute cette mise en page deux fois et j’ai essayé plein de solutions pour rectifier et rien n’y fait, je suppose donc que quelque chose m’échappe et je viens vous demander de l’aide s’il vous plaît.
    Je vous remercie beaucoup d’avance.
    Pardonnez mon manque de vocabulaire informatique, j’espère que vous me comprendrez tout de même 🙂

  9. Lycia Diaz

    Bonsoir Glao. Est-ce que vous avez aussi créer un footer personnalisé ? Car si vous mettez ces éléments dans la template d’article et dans la template du footer ils apparaissent deux fois. Est-ce votre cas ? Sinon, est-ce qu’une fois l’article publié le double contenu est toujours présent ? C’est un peu bizarre…

  10. Glao

    Bonsoir Lycia,
    Je ne sais pas comment répondre à votre réponse alors je crée un nouveau commentaire 🙂
    Tout d’abord merci beaucoup pour votre réponse rapide.
    Je viens de repasser un grand moment et je n’y arrive toujours pas, quelque chose m’échappe c’est certain …
    J’y reviendrai et je finirai bien par trouver mon erreur mais là, ce soir, à force de faire et refaire, je ne comprends même plus ce que je fais alors il est préférable de m’arrêter.
    Je reviendrai vous dire quand j’aurai trouvé comment faire, bonne soirée à vous et merci encore.

  11. Adrien

    Bonjour Lycia,

    Je me demande s’il est possible avec le thème Extra d’ajouter du contenu personnalisé avant et après le corps de l’article ? Il y a après l’article une boîte pour présenter l’auteur par exemple…

    Merci par avance.
    Je suis perdu dans toutes les nouvelles fonctionnalités proposées par Elegant Themes.

  12. Lycia Diaz

    Salut Adrien.
    Je n’utilise pas le thème Extra mais j’imagine que, comme tout thème WordPress, tu peux créer un thème enfant et coder la page single.php ou singular.php qui sont les fichiers-modèles utilisés pour les articles, afin d’y ajouter ton contenu.
    Sinon, si Extra permet aussi de créer des templates de thème avec le thème Builder (comme Divi), dans ce cas, tu peux simplement créer une template d’article et y afficher le contenu où tu veux, directement depuis ton back-office, sans coder. Le tuto est ici : https://astucesdivi.com/template-article-divi/

  13. Jean-Pierre Harzee

    Bonsoir Lycia et merci beaucoup pour ce post et tous tes posts en général
    Je me sens un peu idiot… toute la partie template est ok (enfin je pense) mon soucis… je ne trouve pas ni sais comment arriver á l’appliquer á mes nouveaux articles
    J’utilise Divi Builder et qd je crée un nouvel article, j’ai juste le titre qui apparait (ajouter article avec son nom j’imagine) Ensuite mon article et vide et je dois rajouter des sections et des lignes avant les modules.. est ce normal
    Je pensais seulement devoir remplir le template qui apparaitrai a chaque nouvel article. Est ce que je me trompe
    Merci pour ton support

  14. Lycia Diaz

    Bonjour Jean Pierre. Je ne comprends pas trop ta question. Mais pour être sûre : as-tu placé dans ta template le module Publier un contenu ???? Car c’est grâce à lui que le contenu de tes articles s’affiche.

  15. Jean-Pierre Harzee

    Bonjour et merci pour ton retour très rapide.
    J’ai bien placé le Publier un coutenu dans le template, je vais essayer de mieux tourner ma questions 🙂
    Comment éditer un nouvel article, créer un nouveau contenu avce le template? Quand j’ajoute un nouvel article, actuellement je peux juste ajouter les paramétres tels que le titre du poste et la photo avec l’éditeur WP je pense… et j’amerai pouvoir ajouter le corps de mon contenu en respectant les caractéristiques (format, couleur, taille,…) dans le builder.
    Une vue rapide du dernier article crée actuellement : https://www.mondeshumidificateur.fr/babymoov-hygroplus/ . Dans cette article si je veux éditer le corps du contenu, je dois de nouveau ajouter des sections, des lignes et des modules. Est ce normal?
    Merci pour ton retour

  16. Lycia Diaz

    Salut Jean Pierre,
    La template n’est qu’un cadre qui défini les styles pour l’ensemble d’un type de poste. Après tu dois créer ton contenu dans chaque article, cela ne change pas. Tu peux écrire ton article avec Gutenberg ou avec le Visual Builder.

  17. Samir Hamoutahar

    J’ai un gros de problème avec le module blog. Aidez-moi svp.
    J’essaie de modifier la taille et la couleurs des sous-titres. Mais ça ne change pas lorsque je charge les pages !

    J’ai désactivé tout les plugins mais ça ne marche pas. Ça reste bloqué sur une modification d’il y’a 1 mois ou un peu plus.

    J’ai les balises H2 et H3 qui se ressemblent vraiment beaucoup, je me suis dit que les lecteurs vont peut-être trouver des difficultés à lire mon blog.
    J’ai voulu alors changer les H3 sur le modèle relatif aux catégories dans le thème Builder, pour voir les modifications appliquées à tout les articles.

    Mais oups dans le résultat final lorsque je charge la page, la police des sous-titres ne se modifie pas !
    Meme si je vois le résultat comme souhaité lorsque je souhaite modifier l’un de mes articles dans le thème Builder.

  18. Lycia Diaz

    Salut Samir, je ne comprend pas tout. Tu as peut-être un problème de mise en cache ?

  19. Samir

    Bonjour.
    Je vous remercie tout d’abord pour votre réponse.

    Mais dîtes-moi svp.
    Le fait de changer la police des sous-titres Hn dans le thème builder en modifiant le module blog, change la police des sous-titres de tout les articles déjà créés ? C’est à dire pas la peine de modifier la police des sous-titres de chaque article ? C’est ça ?

    Moi j’ai dû changer la police des sous-titres article par article.

  20. Lycia Diaz

    Salut Samir, normalement, tu dois créer un modèle (template) pour tes articles avec le Theme Builder et en stylisant le module Publier un Contenu, tous tes articles auront la même présentation, le même style de titre, etc.

  21. samir hamoutahar

    Bonjour.
    Oui c’est ce que j’ai fait.
    Mes les articles publiés avant la modification de la police des sous-titres dans le module « Publier un Contenu », n’ont pas été changé automatiquement. Bizarre.
    Je vous remercie beaucoup en tout cas.

  22. Lycia Diaz

    Bizarre

  23. Helene

    Le module post content n’est nul part

  24. Lycia Diaz

    Bonjour Helene,
    Ce module s’appelle « publier un contenu » (« post content » c’est en anglais) et il est disponible uniquement dans le Theme Builder et non le Divi Builder, comme bien indiqué dans mon article.

Soumettre un commentaire

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

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur comment les données de vos commentaires sont utilisées.

Pin It on Pinterest

Shares
Share This