Divi 5 : Créer des modèles d'archive et de page individuelle

Ce guide montre comment créer dans Divi 5 un modèle d’archive pour la vue en liste des biens immobiliers et un modèle de page individuelle pour la vue détaillée d’un bien. Les deux modèles utilisent les modules natifs “1 clic” de WP-ImmoMakler, qui affichent dans le Visual Builder de Divi 5 un aperçu en direct avec de vraies données immobilières.

Note

Ce guide s’applique à Divi 5. Pour Divi 4, consultez les guides Divi 4 : Créer un modèle d’archive et Divi 4 : Créer un modèle de page individuelle.

Astuce

Dans le back-end de votre site web (wp-admin) sous WP-ImmoMakler → Paramètres → Theme Builder, désactivez l’option Le plugin gère la vue en liste et la vue détaillée si vous souhaitez piloter entièrement l’affichage avec le Divi Theme Builder.

Modèle d’archive (vue en liste)

Le modèle d’archive contrôle l’affichage de la page de présentation des biens immobiliers — c’est-à-dire la page sur laquelle tous les biens apparaissent sous forme de liste ou de vignettes.

1. Ouvrir le Theme Builder

   Dans le back-end de votre site web (wp-admin), accédez à Divi → Theme Builder.

   

2. Créer un nouveau modèle

   Cliquez sur + Ajouter un nouveau modèle et choisissez dans le menu déroulant Créer un nouveau modèle.

   

3. Configurer l’affectation

   La boîte de dialogue Paramètres du modèle s’ouvre sur l’onglet Utiliser pour. Cochez les cases suivantes :

   • Dans la section Pages d’archive : toutes les 7 archives de taxonomies immobilières — Toutes les pages Équipement des biens, Toutes les pages Pays des biens, Toutes les pages Types d’usage des biens, Toutes les pages Types de biens, Toutes les pages Lieu des biens, Toutes les pages Statut des biens et Toutes les pages Types de commercialisation des biens
   • Dans la section Biens immobiliers : Page d’archive des biens immobiliers
   

   Attention

   Veillez impérativement à activer les 7 archives de taxonomies dans la section Pages d’archive. Sans ces affectations, le modèle ne s’applique pas aux pages d’archive filtrées — par exemple lorsque des visiteurs filtrent par type de bien, lieu ou type de commercialisation.

   Cliquez ensuite sur Créer le modèle.

4. Ajouter le contenu principal

   Le nouveau modèle apparaît dans le Theme Builder avec le libellé Page d’archive des biens immobiliers. Survolez la zone centrale du modèle et cliquez sur Ajouter un contenu principal personnalisé. Choisissez dans le menu déroulant Créer un contenu principal personnalisé.

   

5. Ajouter une ligne

   Le Visual Builder s’ouvre. Cliquez sur Ajouter une ligne et choisissez la mise en page à une colonne.

   

6. Insérer le module

   Dans la nouvelle ligne, cliquez sur Ajouter un module. Dans la boîte de dialogue Insérer un module ou une ligne, recherchez Vue en liste et cliquez sur WP-ImmoMakler 1 clic : Vue en liste.

   

   Le module est inséré et affiche immédiatement un aperçu en direct de vos biens immobiliers dans le Visual Builder.

   

7. Enregistrer

   Cliquez sur Enregistrer en haut à droite. Le modèle d’archive est maintenant actif.

Modèle de page individuelle (vue détaillée)

Le modèle de page individuelle contrôle l’affichage de la page détaillée d’un bien immobilier unique.

1. Ouvrir le Theme Builder

   Dans le back-end de votre site web (wp-admin), accédez à Divi → Theme Builder.

2. Créer un nouveau modèle

   Cliquez sur + Ajouter un nouveau modèle et choisissez Créer un nouveau modèle.

3. Configurer l’affectation

   Dans la boîte de dialogue Paramètres du modèle, sur l’onglet Utiliser pour, faites défiler jusqu’à la section Biens immobiliers et cochez Tous les biens immobiliers. Cliquez sur Créer le modèle.

   

4. Ajouter le contenu principal

   Dans le nouveau modèle, cliquez sur Ajouter un contenu principal personnalisé et choisissez Créer un contenu principal personnalisé.

5. Ajouter une ligne

   Dans le Visual Builder, cliquez sur Ajouter une ligne et choisissez la mise en page à une colonne.

6. Insérer le module

   Cliquez sur Ajouter un module, recherchez Vue détaillée et choisissez WP-ImmoMakler 1 clic : Vue détaillée.

   

7. Enregistrer

   Cliquez sur Enregistrer. Le modèle de page individuelle est maintenant actif.

Bien immobilier d’aperçu par modèle

Dans le Visual Builder de Divi 5, les modules WP-ImmoMakler affichent un aperçu en direct avec de vraies données immobilières. Vous pouvez définir un bien d’aperçu propre à chaque modèle — par exemple une maison pour le modèle Maison et un bien commercial pour le modèle Commerce.

1. Ouvrir les paramètres de la page

   Dans le Visual Builder, en haut de la barre d’outils, cliquez sur l’icône d’engrenage (paramètres de la page).

2. Choisir l’onglet Contenu et sélectionner le bien d’aperçu

   Dans la fenêtre des paramètres de la page, passez sur l’onglet Contenu. Dans le champ Bien immobilier d’aperçu, saisissez un terme de recherche (n° de bien ou titre) et choisissez le bien souhaité dans la liste.

   L’aperçu de tous les modules WP-ImmoMakler dans le canevas se met à jour immédiatement — sans enregistrer.

3. Enregistrer

   Cliquez sur Enregistrer. La sélection est désormais associée à ce modèle.

Astuce

Tant qu’aucune sélection spécifique au modèle n’est effectuée, c’est le bien d’aperçu global défini dans WP-ImmoMakler → Paramètres → Theme Builder qui s’applique. La sélection spécifique au modèle a toujours la priorité.

Possibilités de personnalisation

Les deux modules “1 clic” affichent l’affichage HTML éprouvé de WP-ImmoMakler. Pour des personnalisations plus poussées :

• Customizer WP-ImmoMakler : ajustez couleurs, polices et espacements via Apparence → Customizer → WP-ImmoMakler
• Paramètres du module : dans le Visual Builder, ouvrez le module pour afficher ou masquer des zones individuelles comme la galerie d’images ou le titre
• CSS : saisissez vos propres styles dans l’onglet Avancé du module ou via un plugin de skin enfant

Pour la vue détaillée, outre le module “1 clic”, des modules individuels spécialisés sont également disponibles — pour la galerie, les données du bien, la carte de localisation, les coordonnées de contact et plus encore. La façon de les intégrer dans une mise en page personnalisée est décrite dans Créer un modèle de page individuelle.

Cela pourrait aussi vous intéresser

• Vue d’ensemble du Divi Theme Builder — Tour d’horizon de tous les modules Divi WP-ImmoMakler disponibles
• Paramètres : Theme Builder — Bien d’aperçu global et vue d’ensemble de toutes les surcharges des builders
• Passage à Divi 5 — Comment les mises en page Divi 4 existantes sont reprises lors du passage
• Divi 4 : Créer un modèle de page individuelle — Concevoir la vue détaillée individuellement avec des modules spécialisés