Comment ajouter la prise de rendez-vous grâce au widget d’intégration ?
Vous souhaitez ajouter rapidement la prise de rendez-vous en ligne ? SmartAgenda a créé un widget d’intégration compatible avec tout système de création de site internet.
Pourquoi intégrer la prise de rendez-vous sur son site internet via un widget d’intégration ?
L’ajout d’un widget de prise de rendez-vous présente plusieurs avantages pour votre entreprise :
- Accessibilité 24/7 : vos clients peuvent réserver un créneau à tout moment, sans avoir besoin de vous contacter directement.
- Expérience utilisateur optimisée : un processus de réservation fluide et intuitif améliore la satisfaction client.
- Gain de temps : moins d’appels et d’échanges pour fixer un rendez-vous, ce qui vous permet de vous concentrer sur votre activité.
- Réduction des rendez-vous manqués : avec les rappels automatiques, vos clients sont mieux informés et plus engagés.
- Adaptabilité à toutes les plateformes : le widget fonctionne aussi bien sur desktop que sur mobile, offrant une expérience homogène.
Récupérer le code du widget
Avant d’intégrer le widget sur votre site, vous devez générer son code d’intégration :
- Accédez à votre espace SmartAgenda.
- Cliquez sur « Réglages » dans la barre des tâches.
- Dans le menu « Site Internet & Widgets », sélectionnez « Widget de prise de rendez-vous ».
- Personnalisez l’affichage du widget selon vos besoins.
- Copiez le code généré.
Comment paramétrer mon widget d’intégration ?
Liste des paramètres disponibles :
| Nom du paramètre | Explication | Valeur attendue |
| affrdv | Affiche directement l’onglet de prise de rendez-vous | true ou false |
| contenu | Affiche l’onglet d’accueil | true ou false |
| entete | Affiche l’en-tête : logo / titre / adresse | true ou false |
| footer | Affiche le pied de page | true ou false |
| bandeau | Affiche le bandeau de connexion | true ou false |
| infosimportantes | Affiche l’info importante | true ou false |
| logo | Affiche votre logo | true ou false |
| photo | Affiche la galerie d’image | true ou false |
| presta | Saisissez l’id de la prestation que vous souhaitez afficher directement lors de la prise de rendez-vous. Ce paramètre permet de prendre rendez-vous directement pour une prestation souhaitée. | ID de la prestation |
| prestasaffichees | Saisissez l’id des prestations que vous souhaitez afficher directement lors de la prise de rendez-vous. Ce paramètre permet de filtrer les prestations de votre choix parmi la liste complète proposée. | ID des prestations (séparé par des virgules) |
| categ | Saisissez l’id de la catégorie de prestation que vous souhaitez afficher directement lors de la prise de rendez-vous. Ce paramètre permet de prendre rendez-vous directement pour une catégorie de prestations souhaitée. | ID de la catégorie |
| employe | Saisissez l’ID de l’utilisateur que vous souhaitez afficher directement lors de la prise de rendez-vous. Ce paramètre permet de prendre rendez-vous directement avec l’utilisateur concerné. | ID de l’agenda |
| groupement | Saisissez l’id du groupement d’agenda que vous souhaitez afficher directement lors de la prise de rendez-vous. Ce paramètre permet de prendre rendez-vous directement avec un groupement d’agenda souhaité. | ID du groupement |
| ins_civilite (1) | Remplissage automatique du champ Civilité | M ou F |
| ins_mail (1) | Remplissage automatique du champ Mail | Adresse mail |
| ins_nom (1) | Remplissage automatique du champ Nom | Texte |
| ins_prenom (1) | Remplissage automatique du champ Prénom | Texte |
| ins_portable (1) | Remplissage automatique du champ Portable | Numéro de téléphone |
| langue (1) | Permet de choisir la langue utilisée pour la réservation en ligne (le multi langue doit être activé sur votre agenda) | Code pays (ex : fr, uk, es, etc…) |
| tkaction (1) | Code unique permettant de sélectionner et vérrouiller la réservation pour une catégorie de prestation, une prestation, un utilisateur, un utilisateur et une prestation donnée. | Nous contacter |
| utm_c4 à utm_c10 (1) | Permet d’ajouter dans les paramètres un ou plusieurs codes de suivi pour identifier la source d’un rendez-vous | Texte |
(1) Ces paramètres sont à saisir dans les paramètres complémentaires à passer dans le champs get du widget. Si vous utilisez plusieurs paramètres, il faut concaténer les paramètres.
Exemple : pour passer les valeurs du nom et du prénom du client :
get : "ins_prenom=John&ins_nom=DOE"
Exemple de widget de prise de rendez-vous :
<script src="https://www.smartagenda.fr/pro/nomagenda/smartwidget.js" type="text javascript"></script>
<script>
window.onload = function(){
var options = {
contenu : false,
entete : true,
footer : true,
bandeau : false,
infosimportantes : true,
logo : true,
photo : false,
presta : 5, // ne pas mettre cette ligne si valeur passée dans l’url ou si le choix est effectué par l’internaute
categ : 5, // ne pas mettre cette ligne si valeur passée dans l’url ou si le choix est effectué par l’internaute
employe : 5, // ne pas mettre cette ligne si valeur passée dans l’url ou si le choix est effectué par l’internaute
affrdv : true,
get : "" // paramètres complémentaires à passer
};
var smartwidget = new SMARTAGENDAwidget(
'smart-container',
'https://www.smartagenda.fr/pro/nomagenda/',
options
);
smartwidget.render();
};
</script>
Remarque : pour faciliter la mise en place, on peut passer les valeurs de la prestation et de l’agenda en paramètre de l’url, par exemple :
https://www.nom-du-site.com/rdv-internet/?presta=1&agenda=5
Ainsi la procédure de mise en place est la suivante :
- Créer une page, par exemple «rdv-internet.html» qui contient le widget mais sans mettre les lignes « presta :» et «employe :» (on peut tout mettre dans le <body>)
- Si vous souhaitez charger directement les disponibilités d’une prestation et/ou d’un agenda alors : sur chaque page du site concernée placer un bouton «prendre rdv» quipointe vers rdv-internet.html?presta=xx&agenda=xx
- Sinon appeler la page «rdv-internet.html» sans passer plus de paramètre particulier
Ajouter le widget à votre site
Intégration sur un site HTML
Si votre site est en HTML, il vous suffit d’insérer le code copié dans le fichier HTML, là où vous souhaitez afficher le widget. Collez le code avant la balise </body> pour assurer un chargement optimal.
Intégration sur un CMS (WordPress, Wix, etc.)
- WordPress : ajoutez un bloc « Code HTML personnalisé » dans votre éditeur de page et collez le code du widget.
- Wix : utilisez l’option « Intégrer un code » et insérez le code du widget.
- Autres plateformes : recherchez l’option « Ajouter un code HTML » et collez le script du widget.
Tester et ajuster
Une fois le widget ajouté, ouvrez votre site pour vérifier son affichage et son bon fonctionnement. Si besoin, retournez dans les réglages de SmartAgenda pour ajuster la personnalisation.
Votre widget est maintenant intégré et vos clients peuvent prendre rendez-vous en toute simplicité !