Ajouter la réservation de locations à votre site Web

Ajoutez le widget de location pour afficher les plages disponibles sur un site Web que vous gérez en dehors de Curling IO. Les visiteurs sélectionnent Réserver pour continuer sur le site Curling IO de votre club. Ils vérifient leur location dans le panier et y finalisent leur commande.

L’affichage des disponibilités de location exige Premium. Configurez d’abord les produits et horaires de location publics. Le widget utilise leurs disponibilités, ressources, prix et limites de réservation actuels.

Ajouter l’extrait

Remplacez yourclub.curling.io par l’adresse Curling IO de votre club, puis ajoutez ce HTML à l’endroit où les plages de location doivent apparaître :

<cio-rentals styling="curling-io"></cio-rentals>
<script src="https://yourclub.curling.io/widgets/rentals.js" defer></script>

Votre éditeur de site Web doit autoriser le HTML et le JavaScript. Après l’enregistrement, prévisualisez la page réelle et vérifiez aussi son action Réserver. L’extrait affiche la période de réservation actuelle; les visiteurs peuvent choisir un jour ou passer d’une semaine à l’autre.

Choisir ce que le widget affiche

Ajoutez ces attributs facultatifs à <cio-rentals> :

Attribut	Effet
product-ids="35"	Afficher seulement les produits de location sélectionnés. Utilisez le nombre dans l’adresse de la page d’administration de chaque produit.
resource-ids="1"	Inclure les horaires de location qui utilisent une ressource sélectionnée. Un horaire correspondant peut aussi proposer ses autres ressources. Utilisez les numéros de ressources dans Paramètres > Ressources.
date="2026-10-20"	Commencer la période de disponibilité de sept jours à la date choisie, au format année-mois-jour.
language="fr"	Demander les libellés en français. L’anglais est la langue par défaut.
color-mode="dark"	Demander le mode sombre.
subdomain="yourclub"	Sélectionner explicitement le sous-domaine d’un club. Vous pouvez généralement omettre cet attribut et charger le script à partir de l’adresse de votre club.
styling="curling-io"	Garder l’apparence Curling IO du widget distincte des styles de votre page. Conservez cet attribut dans l’extrait, sauf si vous comptez définir vous-même son apparence.

Pour plusieurs numéros de produits ou de ressources, utilisez une liste séparée par des virgules, en ordre croissant et sans doublons, comme product-ids="35,36". Chaque liste accepte jusqu’à 50 numéros. Omettez un filtre pour inclure toutes les locations ou ressources admissibles. Utilisez des produits de location publics et des ressources appartenant à votre club.

Vérifier le passage au panier

Réserver ouvre le site Curling IO de votre club dans l’onglet actuel du navigateur. Les visiteurs peuvent accéder au panier avant de se connecter. Suivez les étapes de connexion ou d’inscription requises avant de finaliser leur commande.

Vérifiez la location, la ressource, la date, l’heure et le prix sélectionnés dans le panier. L’ajout de la location ne constitue pas une réservation terminée. Consultez les instructions de réservation pour les curleurs pour finaliser la commande et obtenir de l’aide lorsqu’une plage n’est plus disponible.

Si Curling IO héberge votre site Web

Utilisez le Studio pour placer les disponibilités de location dans une section du site Web géré. Vous n’avez pas besoin du script externe sur un site hébergé. Vous pouvez aussi utiliser le composant de disponibilité des locations dans une page ou un article.

1. Allez dans Site web > Studio, puis sélectionnez Modifier.
2. Dans Source, choisissez la partie du site Web à modifier. Pour une page d’accueil gérée, choisissez landing.json et Page d’accueil gérée sous Page d’accueil.
3. Développez Que peuvent faire ces composants? pour voir les sections prises en charge. Ajoutez un composant de disponibilité des locations à la liste components de la section choisie. Cet éditeur est avancé; conservez les sections existantes que vous souhaitez garder.
4. Sélectionnez Enregistrer, puis vérifiez l’aperçu. Vérifiez les deux langues si votre club utilise l’anglais et le français.
5. Sélectionnez Publier lorsque l’aperçu enregistré est prêt, puis Libérer le verrou.

Par exemple, ce composant affiche les horaires du produit de location 35 qui utilisent la ressource 1. Remplacez ces numéros par les vôtres, ou omettez les filtres :

{
  "type": "cio-rentals",
  "version": 1,
  "productIds": [35],
  "resourceIds": [1]
}

Le filtre de ressources sélectionne les horaires de la même façon que celle décrite ci-dessus. L’enregistrement conserve un brouillon privé; les visiteurs le voient seulement après la publication.

Si les plages ne se chargent pas ou ne sont pas disponibles

Vérifiez l’adresse de votre club, votre accès Premium et les filtres de produits ou de ressources. Utilisez Réessayer si le widget signale un échec de chargement. Votre éditeur de site Web peut bloquer le JavaScript, et un filtre peut exclure toutes les plages disponibles.

Les disponibilités peuvent changer pendant qu’un visiteur fait son choix. Si une plage est refusée, retournez au widget et choisissez une plage disponible. Ne promettez pas qu’une plage affichée sur votre site Web est déjà réservée ou retenue pour le visiteur.