4.1 · Contenu dynamique & champs personnalisés (ACF)

Niveau 4 · Expert : contenu dynamique & e-commerce

4.1Contenu dynamique & champs personnalisés (ACF)

Objectif : connecter les widgets à du contenu dynamique (champs WordPress/ACF) pour des gabarits pilotés par les données.
Temps estimé : 11 min

Le niveau 4 exploite les fonctionnalités EXPERTES d'Elementor Pro, à commencer par le CONTENU DYNAMIQUE (Dynamic Content). Jusqu'ici, on plaçait du contenu STATIQUE (un texte, une image fixes, saisis dans l'éditeur). Le contenu DYNAMIQUE, lui, affiche des données qui VIENNENT D'AILLEURS et VARIENT selon le contexte : le titre de l'article courant, son image à la une, un champ personnalisé, une donnée du site… Au lieu d'écrire une valeur fixe, on LIE un widget à une SOURCE DE DONNÉES dynamique. Exemples : dans un modèle Single (niveau 3-2), le titre dynamique affiche le titre DE CHAQUE article ; un widget image lié à l'« image à la une » affiche celle de chaque article. C'est ce qui permet aux modèles de fonctionner (un modèle, appliqué à des centaines d'articles, chacun avec ses données). Le contenu dynamique relie donc le DESIGN (le modèle Elementor) aux DONNÉES (le contenu WordPress).

Les CHAMPS PERSONNALISÉS (souvent gérés avec ACF — Advanced Custom Fields, une extension très répandue) démultiplient cette puissance. WordPress permet d'ajouter des CHAMPS PERSONNALISÉS aux articles/pages/types de contenu : des données structurées SUR MESURE (par exemple, pour une fiche « bien immobilier » : le prix, la surface, le nombre de pièces ; pour un « membre d'équipe » : le poste, le téléphone, le profil). Elementor Pro peut AFFICHER ces champs personnalisés via le contenu dynamique : on lie un widget à un champ ACF, et il affiche la valeur de ce champ pour chaque contenu. Combiné aux modèles (Single) et aux types de contenu personnalisés, cela permet de construire des sites STRUCTURÉS et RICHES (annuaires, catalogues, fiches, portfolios) où chaque élément affiche ses données propres, avec un design maîtrisé. Points importants. (1) Le CONTENU DYNAMIQUE (Pro) affiche des données qui VARIENT selon le contexte (titre/image de l'article courant, champ personnalisé, donnée du site) — on LIE un widget à une SOURCE de données au lieu d'une valeur fixe. (2) C'est ce qui fait fonctionner les MODÈLES (un modèle affiche les données de chaque contenu — niveau 3-2). (3) Il relie le DESIGN (modèle Elementor) aux DONNÉES (contenu WordPress). (4) Les CHAMPS PERSONNALISÉS (ACF et similaires) ajoutent des données SUR MESURE aux contenus, qu'Elementor affiche dynamiquement — pour des sites structurés (annuaires, catalogues, fiches). (5) C'est un usage AVANCÉ, puissant pour les sites riches en contenu structuré. Maîtriser le contenu dynamique et les champs personnalisés ouvre la construction de sites structurés et data-driven. Le Loop Builder (section suivante) exploite cette logique pour les grilles.

Vocabulaire de la section

Contenu dynamique (Dynamic Content, Pro)
Afficher des données qui VARIENT selon le contexte (titre/image de l'article courant, champ personnalisé, donnée du site) en LIANT un widget à une SOURCE de données — au lieu d'une valeur fixe (statique).
Statique vs dynamique
Statique : une valeur FIXE saisie (un texte, une image précis). Dynamique : une valeur LIÉE à une source qui varie selon le contenu affiché (le titre de chaque article…).
Champs personnalisés (ACF)
Des données structurées SUR MESURE ajoutées aux contenus WordPress (ex. prix, surface pour un bien ; poste, téléphone pour un membre), souvent via ACF (Advanced Custom Fields). Elementor Pro les affiche dynamiquement.
Lien design ↔ données
Le contenu dynamique relie le DESIGN (le modèle Elementor) aux DONNÉES (le contenu WordPress) : un modèle affiche automatiquement les données de chaque contenu.
Sites structurés / data-driven
Combiné aux modèles et types de contenu personnalisés, le dynamique + champs personnalisés permet des sites RICHES et STRUCTURÉS (annuaires, catalogues, fiches, portfolios).
Vérifiez votre compréhension

Quelle est la différence entre contenu statique et dynamique, et à quoi sert le dynamique ?

Tutoriel 4.1
Tutos « 4.1 » Elementor contenu dynamique ACF champs personnalisés (recherche)
Cliquer pour voir les résultats à jour ↗

En pratique — Utiliser le contenu dynamique

  1. Dans un modèle (ex. Single), LIEZ un widget à une SOURCE dynamique (titre de l'article, image à la une, date…) au lieu d'une valeur fixe — le widget affiche les données de chaque contenu.
  2. Ajoutez des CHAMPS PERSONNALISÉS aux contenus (via ACF ou similaire) : des données sur mesure (prix, surface, poste…).
  3. Affichez ces champs personnalisés dans Elementor via le contenu dynamique (lier un widget au champ) — pour des fiches structurées.
  4. Combinez avec les modèles et types de contenu pour construire des sites structurés (annuaires, catalogues, fiches) où chaque élément affiche ses données propres.
Vous utilisez le contenu dynamique et les champs personnalisés (ACF) : relier le design aux données pour des sites structurés et riches (fiches, annuaires, catalogues) où chaque contenu affiche ses propres données.

Points clés à retenir

  • Le CONTENU DYNAMIQUE (Pro) affiche des données qui VARIENT selon le contexte (titre/image de l'article courant, champ personnalisé, donnée du site) : on LIE un widget à une SOURCE de données au lieu d'une valeur FIXE (statique).
  • C'est ce qui fait FONCTIONNER les MODÈLES (Single/archive — niveau 3-2) : un seul modèle affiche automatiquement les données de CHAQUE contenu. Il relie le DESIGN (modèle Elementor) aux DONNÉES (contenu WordPress).
  • Les CHAMPS PERSONNALISÉS (souvent via ACF — Advanced Custom Fields) ajoutent des données SUR MESURE aux contenus (prix, surface, poste…), qu'Elementor affiche DYNAMIQUEMENT (lier un widget au champ).
  • Combiné aux modèles et types de contenu, cela permet des sites RICHES et STRUCTURÉS (annuaires, catalogues, fiches, portfolios) où chaque élément affiche ses données propres avec un design maîtrisé. Usage AVANCÉ et puissant.

Questions fréquentes

Quelle est la différence entre contenu statique et dynamique, et à quoi sert le dynamique ?

Le contenu STATIQUE est une valeur FIXE saisie une fois, le contenu DYNAMIQUE est une valeur LIÉE à une source qui VARIE selon le contexte — le dynamique sert à créer des modèles et des sites où le contenu s'affiche automatiquement à partir des données. Le contenu STATIQUE : (1) C'est du contenu FIXE, saisi directement dans l'éditeur : un texte précis, une image choisie, un titre écrit à la main. (2) Il ne change pas selon le contexte : ce que vous mettez est ce qui s'affiche, toujours pareil. (3) Adapté au contenu PROPRE à une page unique (le texte d'une page « à propos », l'image d'une bannière). Le contenu DYNAMIQUE : (1) C'est du contenu LIÉ à une SOURCE de données, qui AFFICHE une valeur VARIABLE selon le contexte : le titre de l'article courant, son image à la une, un champ personnalisé, la date, l'auteur, une donnée du site… (2) Au lieu d'écrire une valeur, on POINTE vers une donnée : « affiche le titre de l'article » (pas un titre précis). Le widget affiche alors la donnée correspondant au contenu en cours. (3) La même définition affiche des valeurs DIFFÉRENTES selon le contenu : dans un modèle d'article, le titre dynamique affiche « Article A » pour l'article A, « Article B » pour l'article B. À quoi sert le DYNAMIQUE : (1) Faire fonctionner les MODÈLES. C'est l'usage central : un modèle (Single, archive — niveau 3-2) est conçu UNE fois, mais doit s'appliquer à des centaines de contenus, chacun avec ses données. Le contenu dynamique permet cela : le modèle affiche automatiquement le titre, l'image, le contenu DE CHAQUE article. Sans dynamique, un modèle afficherait toujours les mêmes valeurs fixes (inutile). (2) Afficher des CHAMPS PERSONNALISÉS. Des données sur mesure ajoutées aux contenus (prix, surface, caractéristiques…) s'affichent dynamiquement — pour des fiches structurées. (3) Construire des sites STRUCTURÉS / data-driven : annuaires, catalogues, portfolios, fiches — où le design est un modèle et le contenu vient des données. (4) ÉVITER la répétition : au lieu de concevoir chaque fiche/article à la main, on conçoit un modèle dynamique appliqué à tous. (5) Cohérence et maintenance : modifier le modèle met à jour tous les contenus ; le contenu (données) se gère à part (dans WordPress). Un exemple concret : un site immobilier avec des fiches « bien ». (1) STATIQUE : concevoir chaque fiche à la main (impossible pour des centaines de biens, et incohérent). (2) DYNAMIQUE : un MODÈLE de fiche « bien » où les widgets sont dynamiques (titre = nom du bien, image = photo du bien, + champs personnalisés : prix, surface, pièces). Chaque bien (saisi dans WordPress avec ses données) s'affiche automatiquement via ce modèle. Un modèle, des centaines de fiches cohérentes. Comment ça marche dans Elementor : (1) Sur un widget (texte, image…), au lieu d'une valeur fixe, on choisit une SOURCE DYNAMIQUE (icône de contenu dynamique) : le titre du contenu, l'image à la une, un champ ACF, etc. (2) Le widget affiche alors la donnée du contenu courant. (3) On l'utilise surtout dans les modèles (Single, archive, boucle). En résumé : le contenu STATIQUE est une valeur FIXE saisie directement (un texte, une image précis — pour le contenu propre à une page unique), tandis que le contenu DYNAMIQUE est une valeur LIÉE à une source qui VARIE selon le contexte (le titre de l'article courant, un champ personnalisé — la même définition affichant des valeurs différentes selon le contenu). Le dynamique sert à FAIRE FONCTIONNER LES MODÈLES (un modèle conçu une fois affiche automatiquement les données de chaque contenu — articles, fiches), à AFFICHER des CHAMPS PERSONNALISÉS (données sur mesure), et à construire des SITES STRUCTURÉS (annuaires, catalogues, fiches) sans concevoir chaque contenu à la main. Il relie le DESIGN (le modèle) aux DONNÉES (le contenu WordPress) : on gère le design d'un côté (le modèle), les données de l'autre (WordPress), et le dynamique les assemble automatiquement. C'est un usage avancé (Pro) mais essentiel pour les sites riches en contenu structuré — la clé qui transforme Elementor en outil de construction de sites data-driven, pas seulement de pages statiques.

À quoi servent les champs personnalisés (ACF) avec Elementor ?

Les champs personnalisés (souvent via ACF — Advanced Custom Fields) ajoutent des données STRUCTURÉES sur mesure aux contenus WordPress, qu'Elementor affiche dynamiquement — permettant de construire des sites riches et structurés (fiches, annuaires, catalogues) impossibles avec du contenu libre. Le principe des champs personnalisés : (1) Par défaut, un article/une page WordPress a un titre, un contenu (corps de texte), une image à la une, quelques métadonnées. Mais pour certains sites, il faut des données STRUCTURÉES SPÉCIFIQUES. (2) Les CHAMPS PERSONNALISÉS permettent d'AJOUTER des champs sur mesure aux contenus : par exemple, pour une fiche « bien immobilier » — un champ Prix, un champ Surface, un champ Nombre de pièces, un champ Localisation ; pour un « membre d'équipe » — un champ Poste, Téléphone, Réseaux sociaux ; pour un « produit » — des caractéristiques spécifiques. (3) ACF (Advanced Custom Fields) est l'extension la plus répandue pour créer et gérer ces champs (facilement, sans coder) — d'autres solutions existent. (4) Ces champs deviennent des données structurées associées à chaque contenu (chaque bien a son prix, sa surface…). Le rôle d'Elementor : afficher ces champs (1) Elementor Pro peut AFFICHER ces champs personnalisés via le CONTENU DYNAMIQUE : on lie un widget à un champ ACF (« ce widget affiche le champ Prix »), et il affiche la valeur de ce champ pour chaque contenu. (2) Ainsi, dans un modèle de fiche « bien », on affiche dynamiquement le prix, la surface, les pièces — chaque bien montrant ses propres valeurs. (3) On combine champs personnalisés + contenu dynamique + modèles pour construire des fiches structurées appliquées à tous les contenus. À quoi ça sert (les cas d'usage) : (1) ANNUAIRES et RÉPERTOIRES : fiches de membres, d'entreprises, de professionnels (avec des champs : coordonnées, spécialité, horaires…). (2) CATALOGUES et FICHES PRODUITS/BIENS : immobilier (prix, surface, pièces), automobile, produits (caractéristiques structurées). (3) PORTFOLIOS structurés : projets avec des champs (client, année, technologies, lien…). (4) ÉVÉNEMENTS : date, lieu, intervenants, tarif… (5) Tout site où le contenu est STRUCTURÉ (des « fiches » avec des champs récurrents) plutôt que du texte libre. Pourquoi c'est puissant : (1) STRUCTURE. Les données sont organisées en champs précis (pas noyées dans un texte libre) — cohérentes, exploitables, affichables proprement. (2) COHÉRENCE. Toutes les fiches d'un type ont les mêmes champs, affichés de la même façon (via le modèle) — un catalogue homogène. (3) RÉUTILISATION / dynamique. On saisit les données (les champs) dans WordPress, et le modèle Elementor les affiche automatiquement — un modèle pour toutes les fiches. (4) SÉPARATION données/design. Les données (champs) se gèrent dans WordPress (faciles à saisir/mettre à jour), le design est un modèle Elementor — proprement séparés. (5) FILTRAGE/tri possibles (avec le Loop Builder — niveau 4-2 — et d'autres outils) sur ces champs structurés. La combinaison type : (1) Créer un TYPE DE CONTENU (ex. « Biens ») avec des CHAMPS PERSONNALISÉS (ACF : prix, surface…). (2) Saisir les contenus (chaque bien avec ses champs). (3) Concevoir un MODÈLE de fiche (Single) dans Elementor, affichant dynamiquement ces champs. (4) Résultat : des fiches structurées, cohérentes, générées automatiquement. Les bonnes pratiques : (1) Structurer les DONNÉES en champs pertinents (ACF). (2) Concevoir un MODÈLE affichant ces champs dynamiquement. (3) Gérer les données dans WordPress (à part du design). (4) Prévoir l'affichage des champs vides (ne pas afficher un label sans valeur). En résumé : les champs personnalisés (souvent via ACF) servent à AJOUTER des DONNÉES STRUCTURÉES SUR MESURE aux contenus WordPress (prix, surface, poste, caractéristiques… selon le besoin), qu'Elementor Pro AFFICHE dynamiquement (en liant un widget à un champ). Combinés au contenu dynamique et aux modèles, ils permettent de construire des SITES STRUCTURÉS et RICHES — annuaires, catalogues, fiches produits/biens, portfolios, événements — où chaque contenu affiche ses données propres, de façon cohérente, via un modèle unique. L'intérêt : structurer les données (champs précis plutôt que texte libre), garantir la cohérence (toutes les fiches sur le même modèle), séparer les données (WordPress) du design (modèle Elementor), et générer automatiquement des fiches à partir des données. C'est la clé des sites « data-driven » sous WordPress/Elementor : on gère des données structurées et on les affiche via des modèles — bien au-delà du site vitrine à contenu libre. Un usage avancé, très puissant pour tout site à contenu structuré et répétitif.

Autres ressources