Intégrer un widget d'événements sur votre site web

Avec un widget d'événements, vous affichez une liste ou un calendrier de plusieurs événements à la fois sur votre propre site web — par exemple toutes les dates à venir d'un événement récurrent. Les visiteurs choisissent un événement et achètent leurs billets sans jamais quitter votre site.

Créer un widget

1. Dans votre tableau de bord, allez dans Widgets et cliquez sur Nouveau widget.
2. Donnez un nom au widget (vous seul le voyez).
3. Choisissez les événements à afficher :
   • Tous les événements à venir — tout ce qui est publié et à venir.
   • Événements de modèles — tous les événements à venir des modèles choisis ; les nouvelles dates apparaissent automatiquement.
   • Événements sélectionnés manuellement — exactement les événements que vous cochez.
   • Événements par lieu — tous les événements à venir aux lieux choisis. Vous pouvez en plus limiter le widget à une période et fixer un nombre maximum d'événements — par exemple uniquement les 5 prochains par date.
4. Choisissez l'affichage : une liste compacte ou un calendrier mensuel. Sur les petits écrans, le calendrier bascule automatiquement vers la liste.
5. Choisissez la langue par défaut (les dates et libellés des visiteurs la suivent).
6. Sous Page des billets, choisissez si le titre et/ou la date de l'événement apparaissent au-dessus des billets une fois qu'un visiteur a choisi un événement. Utile pour un calendrier, où la case du jour n'affiche qu'une courte mention.

Couleurs et style

Sous Apparence, vous pouvez remplacer la couleur principale, la couleur d'arrière-plan et la couleur du texte, et choisir un arrondi des coins. Tout ce que vous ne définissez pas hérite de votre image de marque. Les utilisateurs avancés peuvent ajouter du CSS personnalisé via les noms de classes stables indiqués dans le formulaire (.ctx-widget, .ctx-event-card, .ctx-calendar, .ctx-day, .ctx-event-entry).

L'installer sur votre site

Après l'enregistrement, copiez l'extrait d'intégration et collez-le dans le HTML de votre site. Comme l'extrait ne référence que l'ID du widget, vous pouvez modifier les événements, l'affichage ou le style plus tard sans retoucher votre site.

Widgets boutique

Avec la fonction Boutique (Studio et Pro), un widget peut afficher votre boutique au lieu d'événements. Sous Type, choisissez Boutique puis ce qu'il affiche :

• Toute la boutique — chaque produit en vente, avec les boutons de filtre par catégorie au-dessus des produits si vous utilisez des catégories.
• Catégories choisies — cochez une ou plusieurs catégories, par exemple uniquement Merchandising sur votre page merch.

Chaque carte produit affiche l'image, le nom, le prix et la disponibilité avec deux boutons : Voir ouvre la page produit et Ajouter au panier ouvre votre boutique avec le produit déjà dans le panier. Les deux s'ouvrent dans la même fenêtre, où l'acheteur termine sa commande et paie. Les produits épuisés restent visibles avec le badge Épuisé. Un widget boutique a les mêmes options sous Apparence, la même langue par défaut et le même extrait d'intégration qu'un widget d'événements ; les produits ajoutés plus tard apparaissent automatiquement.

Widgets via l'API ou un plugin

Sur le plan Pro, chaque action sur les widgets est aussi disponible via l'API REST : lister, créer, modifier et supprimer des widgets, lire leur extrait d'intégration et récupérer les événements qu'un widget affiche. C'est la base d'intégrations de site web comme un plugin WordPress qui place les widgets pour vous. Voir API et webhooks.

Bon à savoir

• Seuls les événements publiés et à venir apparaissent ; les événements passés disparaissent automatiquement.
• Les événements complets restent visibles avec un badge « complet ».
• Le paiement des billets se fait dans le widget — les acheteurs ne quittent jamais votre site. Un widget boutique envoie les acheteurs vers votre boutique pour payer.
• Les codes d'accès fonctionnent aussi dans le widget : les acheteurs peuvent les saisir, et un lien ?unlock= vers la page contenant votre widget y débloque les billets masqués.
• Pour un seul événement : voir le guide du paiement intégré.