Aller au contenu principal
📂 Calendriers

Partager ou intégrer votre calendrier de prise de rendez-vous

Récupérez le lien de réservation de votre calendrier, intégrez-le sur une page CrocoClick ou un site externe, en pop-up ou pré-rempli.

Écrit par Baptiste Lorreyte

Dernière mise à jour Il y a environ 4 heures

Vous avez paramétré votre calendrier : vos disponibilités sont justes, vos rappels sont en place, votre visio est connectée. Il reste l'étape qui déclenche vraiment les rendez-vous : rendre ce calendrier accessible à vos prospects, au bon endroit et au bon moment.

Cet article couvre uniquement le partage et l'intégration. Si vous n'avez pas encore créé votre calendrier, commencez par le guide complet Créer et Gérer ses Calendriers en Ligne, puis revenez ici.

Les trois types de liens de partage

Quand vous ouvrez les options de partage d'un calendrier, CrocoClick vous propose plusieurs liens. Ils ne servent pas à la même chose, et choisir le mauvais est la première cause de liens morts dans les vieux emails.

Type de lienÀ quoi il sertQuand l'utiliser
Lien de planificationL'URL lisible de votre page de réservation, construite à partir du slug du calendrierQuand vous voulez une URL propre à dicter à l'oral ou à afficher en clair
Lien permanentUne URL stable, indépendante du slugPartout ailleurs. C'est le lien à privilégier par défaut
Lien à usage uniqueUn lien valable pour une seule réservation, puis inactifPour un prospect précis, quand vous ne voulez pas que le lien circule
Code d'intégrationUn bloc HTML qui affiche le calendrier directement dans une pagePour intégrer le calendrier sur un site hors CrocoClick

🟢 Important : Privilégiez le lien permanent dans tout ce qui va durer (signature d'email, bio de réseau social, documents commerciaux). Le lien de planification dépend du slug de votre calendrier : si vous modifiez son slug, les liens de planification déjà diffusés peuvent cesser de fonctionner, alors que le lien permanent continue de rediriger correctement.

Récupérer le lien ou le code d'intégration

Pour un calendrier de rendez-vous

  1. Depuis le menu principal, allez dans Calendriers puis Paramètres du calendrier et ouvrez l'onglet Rendez-vous
  2. Sur la ligne du calendrier concerné, cliquez sur l'icône de partage (la flèche oblique)
  3. La fenêtre de partage vous propose le lien de planification, le lien permanent, le lien à usage unique et le code d'intégration
  4. Cliquez sur Copier à côté de l'élément dont vous avez besoin

Pour un groupe de calendriers

Si vous avez regroupé plusieurs types de rendez-vous dans un groupe, pour que le visiteur choisisse lui-même la prestation, c'est le lien du groupe qu'il faut diffuser, et non celui d'un calendrier isolé. Partager un calendrier individuel enfermerait votre prospect sur un seul type de rendez-vous.

  1. Allez dans Calendriers puis Paramètres du calendrier et ouvrez l'onglet Rendez-vous
  2. Dans la colonne de gauche, sous la section Groupes, cliquez sur les trois points du groupe concerné
  3. Sélectionnez Partager le groupe
  4. Copiez le lien permanent ou le code d'intégration

Pour un service ou une catégorie de services

Les calendriers de l'onglet Services se partagent de la même façon, avec un niveau de granularité en plus : vous pouvez diffuser la vitrine complète, une catégorie, ou un service unique.

  1. Allez dans Calendriers puis Paramètres du calendrier et ouvrez l'onglet Services
  2. En haut à droite, à côté de Voir la page de réservation, cliquez sur la flèche du menu déroulant puis sur Toutes les options de partage pour obtenir les liens de la vitrine complète
  3. Pour une catégorie précise, cliquez sur les trois points de la catégorie dans la colonne de gauche, puis sur Partager la réservation
  4. Pour un service précis, cliquez sur les trois points à droite de la ligne du service, puis sur Partager la réservation

Afficher votre calendrier sur une page CrocoClick

Si votre page de réservation vit dans un tunnel ou un site CrocoClick, privilégiez l’élément Calendrier dédié lorsqu’il propose le calendrier voulu. Le code d’intégration reste utile pour un parcours qui n’est pas proposé par cet élément.

  1. Ouvrez la page dans le constructeur de page
  2. Ajoutez l'élément Calendrier à l'endroit voulu
  3. Dans les réglages de l'élément, choisissez le calendrier proposé ; pour un groupe, une vitrine ou un service absent du sélecteur, utilisez son propre lien ou code de partage
  4. Enregistrez, puis publiez la page

💡 ASTUCE : L'élément Calendrier reste lié à votre calendrier en temps réel. Si vous changez la durée des créneaux ou les questions du formulaire de réservation, la page se met à jour toute seule, sans republication.

Intégrer votre calendrier sur un site externe

Le code d'intégration affiche votre calendrier dans une iframe. Concrètement, le visiteur reste sur votre site externe, réserve dans la fenêtre intégrée, et le rendez-vous atterrit dans CrocoClick comme s'il était passé par la page de réservation classique. La réservation est traitée dans CrocoClick. La création ou mise à jour du contact et les suivis dépendent des réglages, des déclencheurs et de l’admissibilité des canaux ; l’iframe ne les configure pas.

Récupérer le code

  1. Ouvrez les options de partage de votre calendrier (voir plus haut selon le cas)
  2. Sélectionnez l'onglet Code d'intégration
  3. Cliquez sur Copier

Le code copié ressemble à ceci, avec vos identifiants à la place des valeurs génériques :

<iframe src="VOTRE_LIEN_DE_RESERVATION" style="width:100%;border:none;overflow:hidden;" scrolling="no" id="VOTRE_IDENTIFIANT"></iframe>
<script src="LE_SCRIPT_FOURNI_PAR_CROCOCLICK" type="text/javascript"></script>

⚠️ Remarque : Copiez toujours le code depuis l'interface plutôt que de le recopier à la main, et collez-le en entier. Les deux lignes sont solidaires : la balise iframe affiche le calendrier, la balise script ajuste automatiquement sa hauteur au contenu. Si le script est filtré ou bloqué, l’ajustement de hauteur peut manquer ; contrôlez le conteneur et le rendu public sur plusieurs tailles.

Où coller le code selon votre plateforme

La logique est la même partout : trouver le bloc qui accepte du HTML brut et y coller le code. Seul le nom du bloc change.

PlateformeOù coller le codePoint de vigilance
WordPressUn bloc HTML personnalisé dans l'éditeur Gutenberg, ou l'onglet Texte de l'éditeur classique. Avec un constructeur comme Elementor ou Divi, utilisez le widget HTML ou CodeNe collez jamais le code dans l'éditeur visuel en mode texte enrichi : WordPress échapperait les balises et afficherait le code au lieu du calendrier
WixAjouter puis Intégrer un code puis Intégrer du HTML, et collez le code dans le champ CodeLe conteneur Wix a une hauteur fixe qu'il faut agrandir à la main. Ajustez sa hauteur au contenu réel et vérifiez séparément le mobile ; il n’existe pas de hauteur universelle
SquarespaceUn bloc Code sur la page, en veillant à ce que le mode HTML soit sélectionnéVérifiez que votre formule et le bloc choisi acceptent le HTML, les iframes et le JavaScript nécessaires
ShopifyUne page ou un article via l'éditeur de contenu, en basculant sur l'icône Afficher le code HTML. Pour une section de thème, passez par la personnalisation du thème et un bloc de code personnaliséCertains thèmes filtrent les balises script. Si la hauteur ne s’ajuste pas, faites vérifier le bloc et le thème sur une copie ; ne modifiez pas directement le thème actif sans sauvegarde

💡 ASTUCE : La démarche est exactement la même pour vos formulaires. Si vous devez aussi intégrer un formulaire de contact ou de capture sur ce site, l'article Intégrer un formulaire CrocoClick sur un site externe détaille les mêmes plateformes.

Ouvrir votre calendrier en pop-up depuis un bouton

Afficher le calendrier en permanence sur une page longue casse souvent le rythme de lecture. La fenêtre contextuelle règle le problème : le visiteur lit votre argumentaire, clique sur un bouton, et le calendrier apparaît par dessus la page, sans la quitter.

Sur une page CrocoClick

  1. Dans le constructeur de page, créez une fenêtre contextuelle et placez-y l'élément Calendrier
  2. Sélectionnez votre bouton d'appel à l'action, par exemple "Réserver mon appel"
  3. Dans les actions du bouton, choisissez l'ouverture de la fenêtre contextuelle
  4. Prévisualisez la page pour vérifier que le calendrier s'affiche entièrement, y compris sur mobile

Le paramétrage complet des fenêtres contextuelles (déclencheurs, animations, fréquence d'affichage) est détaillé dans Comment utiliser les fenêtres contextuelles sur CrocoClick.

Sur un site externe

Deux approches, selon vos moyens :

  • La plus simple : faites pointer votre bouton vers le lien permanent du calendrier, en ouvrant un nouvel onglet. Aucun code d’intégration requis ; contrôlez tout de même le lien et son ouverture
  • La plus élégante : utilisez la fonction de fenêtre modale de votre thème ou de votre constructeur, et collez le code d'intégration à l'intérieur. Le calendrier s'ouvre par dessus la page, comme sur CrocoClick

Pré-remplir le formulaire de réservation

Le préremplissage dépend du formulaire et du widget réellement utilisés. N’ajoutez pas une liste de paramètres supposés universels à tous les liens de calendrier. Vérifiez les clés de requête des champs dans votre propre formulaire et validez avec des données fictives avant diffusion ; ne placez aucune donnée confidentielle dans une URL, qui peut être journalisée ou partagée.

Le mécanisme Sticky Contact, lorsqu’il est activé, peut aussi rappeler des coordonnées déjà saisies sur le même navigateur et appareil ; il ne constitue ni une identification certaine ni un consentement. Évitez cette mémorisation sur un appareil partagé. Pour les valeurs d’URL réellement prises en charge, encodez espaces, signes plus et esperluettes et vérifiez le résultat.

Vous pouvez aller plus loin et faire remonter l'origine du prospect dans votre CRM en passant vos propres paramètres vers des champs cachés du formulaire de réservation. La méthode est expliquée dans Suivre l'origine des prospects avec les champs cachés et les paramètres d'URL.

Où diffuser votre lien de réservation

Un lien de réservation n'a de valeur que là où votre audience se trouve déjà. Voici les emplacements qui produisent le plus de rendez-vous, et la manière de les traiter.

EmplacementBonne pratique
EmailPlacez le lien sur un bouton plutôt que sur une URL brute, et n’ajoutez des champs de contact que si le widget accepte leurs clés et que leur présence dans l’URL est appropriée
SMS et WhatsAppLe lien permanent, seul, sans autre lien dans le message. Rédigez une phrase courte : l'aperçu du lien fait déjà le travail de contexte
Signature d'emailUn libellé explicite du type "Réserver 15 minutes avec moi" plutôt que l'URL nue. Utilisez impérativement le lien permanent, une signature vit des années
Bio de réseau socialLe lien du groupe de calendriers si vous proposez plusieurs prestations, pour que le visiteur choisisse lui-même
Site et tunnelL'élément Calendrier ou une fenêtre contextuelle, plutôt qu'un lien sortant qui fait quitter la page

💡 ASTUCE : Créez un lien déclencheur qui redirige vers votre calendrier, et diffusez ce lien déclencheur plutôt que le lien direct. Dans un message lié à un contact et sur un canal pris en charge, un lien déclencheur peut enregistrer un clic attribué. Il ne permet pas d’identifier tous les visiteurs anonymes d’une page publique, ni de prouver un clic humain ou une réservation ; contrôlez le consentement et les doublons avant toute relance.

Dépannage

Passez ces points en revue dans cet ordre :

  • Le code a-t-il été collé en entier ? Il faut la balise iframe et la balise script. Une copie partielle est la cause la plus fréquente
  • Le code est-il dans un bloc HTML ? Dans un bloc de texte enrichi, les balises sont échappées et vous voyez le code s'afficher tel quel à la place du calendrier
  • Le lien de réservation fonctionne-t-il seul ? Ouvrez-le dans un onglet en navigation privée. S'il ne s'affiche pas non plus, le problème est dans le calendrier, pas dans l'intégration
  • Le calendrier a-t-il des disponibilités ? Un calendrier sans créneau disponible peut présenter un message ou aucune heure proposée ; distinguez cette situation d’une iframe qui ne charge pas
  • Un bloqueur de publicité est-il actif ? Certaines extensions bloquent les iframes de réservation. Testez avec les extensions désactivées avant de conclure

Si le calendrier lui-même est en cause, l'outil de dépannage des calendriers identifie précisément ce qui bloque la disponibilité.

C'est un problème de hauteur, et il a presque toujours la même origine : la balise script n'a pas été collée, ou la plateforme l'a supprimée. Sans elle, l'iframe garde une hauteur fixe qui ne suit pas le contenu.

Trois correctifs, du plus simple au plus technique :

  1. Recollez le code complet, script inclus
  2. Agrandissez le conteneur de votre plateforme. Sur Wix ou Squarespace, le bloc a une hauteur définie à la main : adaptez la hauteur au formulaire et à chaque étape ; ces valeurs éventuelles sont des essais de mise en page, pas des minima garantis
  3. Ajoutez une hauteur minimale directement dans la balise iframe, par exemple style="width:100%;min-height:750px;border:none;"

Vérifiez ensuite sur mobile : le calendrier passe en affichage vertical et devient plus haut que sur ordinateur.

Le calendrier vit dans une iframe, donc le CSS de votre site ne peut pas atteindre son contenu. En revanche, il agit sur le conteneur qui l'entoure, et c'est là que naissent les problèmes :

  • Largeur bridée : un conteneur de thème avec une largeur maximale étroite comprime le calendrier. Placez le bloc dans une section pleine largeur ou augmentez la largeur du conteneur
  • Débordement masqué : une règle overflow: hidden sur la section parente rogne le bas du calendrier. Retirez-la sur cette section
  • Animation à l'apparition : les effets de type fondu au défilement partent souvent d'une opacité nulle. Si l'animation ne se termine pas, le calendrier reste invisible. Désactivez l'animation sur ce bloc
  • Chargement différé : un chargement paresseux agressif peut empêcher l'iframe de se charger. Excluez ce bloc du chargement différé

Pour isoler la cause en une minute : créez une page vierge, sans en-tête ni pied de page, et collez-y le même code. Si le calendrier s'y affiche correctement, recherchez une différence de style, de script, de politique de sécurité ou de chargement sur la page d’origine.

Oui, en créant un groupe de calendriers et en partageant le lien ou le code du groupe. Le visiteur voit alors tous vos types de rendez-vous et choisit lui-même. C'est bien plus lisible que d'empiler plusieurs iframes sur une même page, ce qui alourdit considérablement le chargement.

Oui, sans différence avec la page de réservation classique. Le rendez-vous est traité par le calendrier correspondant. Contrôlez les règles de création ou rapprochement du contact, les workflows publiés et les notifications activées ; l’intégration seule ne garantit aucun suivi. L'iframe n'est qu'une fenêtre d'affichage : tout le traitement reste dans CrocoClick.

Oui. Si vous avez activé l'encaissement à la réservation, l'étape de paiement s'affiche dans l'iframe comme sur la page de réservation. Contrôlez la hauteur, le navigateur, les restrictions du site hôte et le moyen de paiement ; un affichage de l’étape ne prouve pas un encaissement, l'étape de paiement rallonge le parcours. La configuration est détaillée dans Configurer les paiements dans les calendriers CrocoClick.

Tout dépend du lien que vous avez diffusé. Le lien permanent continue de fonctionner, c'est précisément sa raison d'être. Le lien de planification, lui, est construit à partir du slug : la modification de ce slug peut le casser ; changer seulement le nom affiché n’implique pas nécessairement de changer le slug. Un code d'intégration déjà en place sur un site externe suit la même règle selon le lien qu'il contient. D'où la recommandation du lien permanent dès le départ.

Cela a-t-il été utile ?

Besoin d'aide supplémentaire ? Demander à l'équipe