# Afficher les événements de The Events Calendar dans un Loop Grid Elementor

> Connecter les événements de The Events Calendar à un Loop Grid Elementor natif, sans widget d'affichage supplémentaire ni billetterie à intégrer.

- Auteur : WordPress Développement
- Publié le : 2024-09-10
- Mis à jour le : 2024-09-10
- Catégorie : Elementor
- URL : https://www.wpmoderne.fr/elementor/events-calendar-loop-grid-widget-natif/

## L’essentiel

- Le CPT tribe_events s'interroge comme n'importe quel type de contenu
- Le Loop Builder remplace les modèles d'affichage propriétaires
- Les métadonnées de date restent la partie la plus délicate

Comment afficher une liste d'événements à venir dans une page Elementor sans installer un widget d'affichage tiers en plus de The Events Calendar ? La question revient régulièrement dans les projets de lieux culturels : théâtres, salles de concert, médiathèques. L'extension de Modern Tribe crée un type de contenu personnalisé, `tribe_events`, mais ne fournit pas nativement de rendu compatible avec l'éditeur Elementor.

La bonne nouvelle, c'est que ce type de contenu se comporte comme n'importe quel post type public. Le Loop Grid d'Elementor Pro peut donc l'interroger directement, sans passer par un plugin de pont entre les deux extensions. Ce tutoriel détaille la marche à suivre pour un lieu culturel qui veut afficher sa programmation à venir sur sa page d'accueil, sans toucher à la billetterie.

## Vérifier que le type de contenu est bien interrogeable

Avant toute chose, il faut confirmer que `tribe_events` est enregistré avec `public` à `true` et exposé aux requêtes de l'éditeur. Un rapide passage par l'onglet Requête d'un widget Posts standard permet de vérifier que le type apparaît dans la liste déroulante des sources. S'il n'apparaît pas, c'est généralement le signe d'une version de The Events Calendar trop ancienne ou d'un filtre tiers qui restreint la visibilité du type de contenu.

### Identifier les métadonnées utiles

The Events Calendar stocke la date de début dans la métadonnée `_EventStartDate` et la date de fin dans `_EventEndDate`. Ce sont ces deux clés qui permettront de trier les événements par ordre chronologique et d'exclure les dates passées.

## Construire le Loop Grid pas à pas

> L'essentiel à retenir : Le CPT tribe_events s'interroge comme n'importe quel type de contenu ; Le Loop Builder remplace les modèles d'affichage propriétaires ; Les métadonnées de date restent la partie la plus délicate

1. Ajouter un widget Loop Grid sur la page, puis créer un nouveau modèle de boucle dédié aux événements.
2. Dans le modèle de boucle, placer les widgets Titre, Image en vedette et un widget Texte dynamique pointé sur `_EventStartDate` via une balise dynamique de type métadonnée personnalisée.
3. Revenir sur le widget Loop Grid parent et, dans l'onglet Requête, choisir `tribe_events` comme source.
4. Ajouter une requête personnalisée avec `meta_key` réglé sur `_EventStartDate` et `meta_compare` sur `>=`, en comparant à la date du jour pour ne montrer que les événements à venir.
5. Trier le résultat par `meta_value` en ordre croissant, pour obtenir la programmation dans l'ordre chronologique attendu.

Ce montage évite d'installer un widget d'affichage additionnel : la logique de requête reste entièrement dans l'onglet Requête du Loop Grid, et seul l'agencement visuel dépend d'Elementor.

## Gérer la pagination et le filtrage par catégorie d'événement

The Events Calendar propose sa propre taxonomie, `tribe_events_cat`, pour classer les événements par type : concerts, expositions, ateliers. Cette taxonomie est disponible dans les filtres du Loop Grid au même titre que n'importe quelle taxonomie WordPress, ce qui permet de proposer plusieurs blocs sur une même page, chacun filtré sur une catégorie différente.

Pour la pagination, le comportement par défaut du Loop Grid fonctionne correctement avec ce type de contenu, à condition de garder un nombre d'éléments par page raisonnable ; au-delà d'une trentaine d'événements affichés simultanément, le temps de rendu de la page commence à se faire sentir sur un hébergement mutualisé standard.

## Les limites à connaître avant de se lancer

- Les événements récurrents de The Events Calendar génèrent parfois des entrées dupliquées dans la boucle si le filtre de requête ne cible pas explicitement l'instance principale.
- Le widget Loop Grid n'a pas connaissance du statut « événement complet » propre à certaines extensions de billetterie tierces : cette information doit être exposée via une métadonnée séparée si elle doit apparaître dans la boucle.
- Le fuseau horaire des dates dépend du réglage général de l'extension, pas de celui d'Elementor ; toute incohérence de tri vient presque toujours de là.

> Sur ce type de montage, mieux vaut toujours tester le tri chronologique avec un événement à cheval sur le changement d'heure d'été : c'est le cas qui révèle le plus vite un mauvais réglage de fuseau.

## Notre verdict

Relier The Events Calendar à un Loop Grid natif fonctionne bien pour un affichage éditorial simple : liste de la programmation à venir, mise en avant visuelle soignée, filtrage par catégorie. Cette approche atteint ses limites dès que le lieu culturel a besoin d'un calendrier mensuel interactif ou d'une billetterie intégrée : ces fonctions restent du ressort de l'extension elle-même, pas de la couche de mise en page.