WP Booking Calendar by ToTuM OrBeM

I – 2. Affichage de votre calendrier de réservation en Ligne

• Lundi=> 13h00 à 17h00
• Mardi=> 9h à 12h30 puis 13h45 à 16h55
• Mercredi=> 8h à 12h30 puis 13h30 à 18h
• Jeudi=> 9h à 12h30 puis 13h45 à 16h55
• Vendredi=> 9h à 12h30 puis 13h45 à 16h55
• Samedi=> 8h à 19h30 non-stop
• Dimanche=> fermé

1 Boulevard de Belleville
75020 PARIS

Prestation :

• Coupe Femme
• Coupe Homme
• Coupe enfant
• Coupe + Couleur
• Brushing
• Extension
• Coupe + couleur + brushing + extension

Paiement en ligne exigé

Adresse (Fictive) :

1 Rue De Paradis
75010 PARIS

Prestation :

• Coupe Femme
• Coupe + Couleur
• Brushing
• Coupe + couleur + brushing
• Epilation

Le gestionnaire de cette agence souhaite afficher les prix sur le calendrier de réservation.

Par contre il ne souhaite pas que les clients payent en ligne.

Adresse (Fictive) :

15 Rue Lafayette
13001 MARSEILLE

Prestation :

• Coupe Femme
• Coupe Homme
• Barbe

Le gestionnaire de cette agence ne souhaite pas que ses clients payent en ligne et privilégie le rapport humain.

Il ne souhaite pas non plus afficher ses prix sur le calendrier de réservation.

Id du Calendrier Google :

C’est le lien de partage de votre Calendrier Google. Suivez notre tutoriel pour trouver l’Id du Calendrier Google à partager sur mon site WordPress.

Hauteur en PX pour 1 heure :

Hauteur en pixel pour 1 heure sur le Front End.

Timezone :

Timezone que vous avez parametrée sur votre calendrier Google, pour y faire correspondre vos RDV. Où trouvez mon Timezone Google Calendar.

Langue :

Langue appliquée sur  le Back-end et le Front-end.

Format de l’heure :

Format de l’heure 24h ou AM-PM affichée sur le Front-end

Format de la date :

Format de la date DD/MM/YYYY ou MM/DD/YYYY affichée sur le Front-end

RGPD :

Rend le consentement obligatoire, enregistre dans la BDD l’heure et la date du consentement de l’utilisateur. Si option cochée, veuillez mettre un texte demandant le consentement de l’utilisateur.

URL politique de confidentialité :

lien vers votre politique de confidentialité

Autorisation Json compte de service

Télécharger ici votre autorisation Json compte de service. Vous devez impérativement Zipper le fichier avant de le télécharger. Suivez notre tutoriel pour trouver mon autorisation compte de service.

Autorisation Json ID Client Oauth 2.0

Télécharger ici votre autorisation Json ID Cient Oauth 2.0. Vous devez impérativement Zipper le fichier avant de le télécharger. Suivez notre tutoriel pour trouver mon autorisation Oauth2.0.

Code pour Authorisation Google Calendrier API

L’option ne sera accessible que lorsque les autorisations Json “compte de service” et “ID Client Oauth 2.0” seront téléchargées. Il vous suffira de cliquer sur le lien de “demande de code d’autorisation” mais pour celà vous devrez avoir créer votre écran d’autorisation d’application. Si besoin, suivre le tutoriel en cliquant ici pour la demande de code d’autorisation.

Dans cette onglet, vous pouvez régler jour par jour les paramètre suivant :

Début :

Défini le début de la semaine.

Fermé :

Défini si le jour en question est un jour de fermeture.

Jour de la semaine :

Vous ne pouvez intervenir sur cette partie, elle est figée, et défini par le choix de la langue sur l’onglet “Réglage”

Heure de (début/fin) de (journée/pause) :

Remplissez ici les horaires de votre planning. Si vous ne remplissez pas un des champs “pause”, le créneau pause ne sera pas affiché.

Dupliquez “Lundi” :

J’ai mis en place ce bouton pour nous simplifiez le remplissage de cette onglet. Remplissez uniquement le “jour 1” soit “Lundi” puis cliquez sur “Dupliquer”. Ensuite modifiez les jours différent de Lundi. Une fois effectué, enregistrez vos paramètres.

Paiement PayPal obligatoire pour réservation :

Option à cocher et à valider si vous souhaitez mettre en place des réservations payantes qui pourront être appliquées (ou pas) aux differents types de RDV.

La suite des options apparaissent lorsque vous validez “paiement obligatoire”.

Devise :

Choix de la devise pour le paiement Paypal. Votre compte Paypal s’occupera de la conversion si vous choississez une devise différentes de la votre.

ID client PayPal :

Remplissez ici votre ID client PayPal disponible sur votre compte “Developpeur Paypal“. Tutoriel détaillé plus bas dans la section “Tutoriel“.

ID secret PayPal :

Remplissez ici votre ID secret PayPal disponible sur votre compte “Developpeur Paypal“. Tutoriel détaillé plus bas dans la section “Tutoriel“.

Afficher la légende “En attente de paiement” :

Il s’agit ici d’afficher (ou pas) le faite que le paiement PayPal est bien validé et terminé. Si ce n’est pad le cas, un cadre rouge apparait autour du RDV. Vous pourrez ensuite valider ce paiement sur “Gestion des RDV” dans le Back-end lorsque le paiement est reçu.

Mode “Live” ou “Sandbox” :

Pour faire des essais avec votre compte sandbox PayPal. Attention, les ID “client” et “secret” de PayPal sont différent en “Live” ou “Sandbox”. Pensez à vider votre cache lorsque vous changez de mode.

Interval entre l’heure actuelle et le premier créneau de réservation :

Il s’agit ici de mettre en place une limite de temps (en heure) avant la première prise de RDV. Par exemple pour un réglage à 48h ; si nous somme Lundi 14h, ne ne pourrons réserver qu’à partir de Mercredi 14h. De 0 à 9999 h.

E-mail général :

Adresse qui sera prévenu obligatoirement en cas de nouveaux RDV. Par exemple, le secrétariat d’un cabinet d’architecte. Pour que l’architecte puisse être prévenu, il faudra remplir également sont E-mail dans l’onglet “Intervenant”. Si possible, vérifier avec google votre adresse, elle sera transformée en lien dans le mail de confirmation de RDV. Le format toléré par Google est :
“1 place de la comédie, 34000 Montpellier”
numéro nom de rue “,” code postal ville

E-mail d’envoi :

E-mail de l’expéditeur lors de la confirmation du RDV. Pensez bien à paramétrer votre domaine, et votre E-mail chez votre hébergeur pour ne pas être filtré en temps que SPAM.

Adresse générale :

Adresse du siège sociale qui sera ajouté au mail de confirmation de RDV pour l’internaute.

Nombre d’intervenant :

Réglable de “0” à “20”. “0” masquant ainsi le choix de l’intervenant dans le formulaire de réservation du Front-End. De “1” à “20”, le formulaire laisse le choix de l’intervenant, et donne la possibilité de choisir “le premier disponible” suivant le créneau horaire choisi.

Nombre de types de RDV :

Réglable de “0” à “9999”. Nous vous conseillons de ne pas trop en mettre car il faut ensuite régler chacun des types de RDV. Cette option peut alors alourdir votre site et provoquer des ralentissements si vous exagerez.

Afficher les prix sur le bouton de validation :

Option n’apparaissant que si vous avez choisi l’option de paiement Paypal. Elle permet d’afficher le prix sur vos types de RDV payants. Les types de RDV gratuits afficheront “réservation gratuite”.

Civilité :

Mr, Mme, Mlle, Dr ou rien du tout, à votre guise.

Nom :

Nom de l’intervenant, partenaire, prestataire ou ANNEXE. Vous pouvez ici mettre plusieurs mots, par exemple “nom” et “prénoms”

E-mail :

E-mail de l’intervenant, partenaire, prestataire ou ANNEXE qui sera prévenu lors de la création d’un nouveau RDV.

Spécialité (facultatif) :

 Juridique, administratif, pénal pour un cabinet d’avocat par exemple.

Couleur :

Au choix… c’est une feuille de style CSS background-color (blue, grey, rgb(x,y,z), ou rgba(x,y,z,opacité).

Afficher le choix “Le premier créneau disponible de …” :

Permet en Front-end de donner la possibilité à l’internaute de choisir le premier créneau horaire disponible sur le créneau sélectionné. Si le “type de RDV” choisi ne rentre pas sur le créneau choisi par manque de place au planning, le plugin proposera le premier créneau disponible de la journée, sinon, il alertera l’internaute de l’impossibilité de prendre RDV à cette date et celà pour chaque intervenant.

Payant :

Cette option n’apparait que si vous avez validé “paiement obligatoire pour réservation”. Elle permet de déclencher l’obligation de paiement pour chaque type de RDV.

Prix :

Prix de la réservation du type de RDV.

Type de RDV :

Libellé du type de RDV affiché en Front-end.

Temps (minutes) :

Temps en minutes attribué pour ce type de RDV.

Adresse :

Si l’adresse du type de RDV est différente de celle de l’adresse général, c’est ici qu’il faut la changer. Si possible, vérifier avec google votre adresse, elle sera transformée en lien dans le mail de confirmation de RDV. Le format toléré par Google est :
“1 place de la comédie, 34000 Montpellier”
numéro nom de rue “,” code postal ville

Checkbox et radio d’affectation :

A vous de choisir désormais si tel ou tel type de RDV et affectés à tel ou tel intervenant, et si tel ou tel type de RDV est affectée à l’adresse générale ou à sa propre adresse de type de RDV.

Utiliser Recaptcha V3 :

Tout est dit… cochez pour valider.

Clé du site :

Rentrez ici votre clé du site disponible sur votre compte admin recaptcha. Voir tutoriel plus bas.

Clé secrète :

Rentrez ici votre clé secrète disponible sur votre compte admin recaptcha. Voir tutoriel plus bas.

Badge Recaptcha v3 invisible :

Vous trouvez le badge un peu trop présent, cette option vous permet de masquer le badge Recaptcha v3.

Pourquoi un onglet tout seul ici… c’est parce que le plugin sera évolutif est que les shortcodes “mois” et “semaine” devrait pas tarder à arriver dans les versions prochaines.

Affichage du shortcode :

Titre de votre calendrier affichage journée (facultatif) :

Vous pouvez donner un titre à votre calendrier, par exemple “cliquez pour réserver”.

Journée à afficher :

Lors du chargement de la page contenant de shortcode (ou le widget), cette option permettra de charger le jours que vous aurez paramétré. Aujourd’hui =0, demain=1, après-demain=2, etc…

Si vous avez paramétré le premier créneau de réservation à 48 heures, la logique voudrait que vous paramétriez ici “2” ; sauf si vous voulez affiché le sur-lendemain, c’est à votre guise.

Ici vous avez une vision sur l’ensemble des RDV pris sur le calendrier aussi bien sur le Front-end que sur le Back-end.

Vous avez accès aux informations suivantes : numéro de télephone des client, e-mail, ainsi que leur nom et prénom si toute fois vous en avez besoin pour la bonne gestion de votre planning et du RDV de votre internaute.

Ici apparait aussi les numéros de commande PayPal ainsi que l’ID PayPal qui a validé le paiement et la date de consentement (RGPD).

Valider un paiement en attente :

Cette option vous permet de valider un paiement PayPal qui n’a pas pu être confirmé par PayPal lors de la commande.

Supprimer des RDV :

En sélectionnant les ID de votre choix et en cliquant sur le bouton “Supprimer”, les RDV avec les ID correspondant seront supprimés de votre BDD et sur le calendrier Google.

ATTENTION : en supprimant les RDV directement de votre calendrier Google, vous ne pourrez plus alors supprimer les RDV de ce tableau. La version v2.0 du plugin corrigera ce détail.

Ici, vous pourrez créer des RDV par intervenant ou prestataire directement depuis le Back-end (par exemple si on vous appel sans passer par le site internet, ce que pourez faire les personnes récalsitrantes à internet). Dans votre tableau de gestion des RDV, dans la colonne “Numéro de commande” apparaitra “Wordpress Admin”. Comme dans le Front-end, la création d’un RDV transmettra un mail à l’internaute, ainsi qu’à l’intervenant concerné.

Le type de RDV et l’adresse du RDV n’apparaitront qu’une fois l’intervenant sélectionné. Ils seront pré-rempli avec les informations que vous aurez parametré dans le plugin.

Depuis cet onglet, l’adresse du RDV est pré-rempli mais si vous le souhaitez vous pourez modifier cette adresse à votre souhait pour le notifier à l’internaute.

ATTENTION :
ici vous pouvez choisir n’importe quelle heure pour votre RDV, donc si vous choisissez un horaire hors de la plage horaire de votre journée de travail, le RDV sera masqué et n’apparaitra pas dans le Front-End.

Cet onglet vous permet d’effacer les évenement de votre database vieux du nombre de jour choisi. Vous n’êtes pas censé savoir que d’après la RGPD, vous devait dans votre “politique de confidentialité” préciser à l’internaute le nombre de jours que vous gardé les éléments le concernant.

Ici vous sélectionnez une période en jour, et tous les évenement plus vieux que cette période seront effacés selon votre choix.

Une fois la période sélectionné, deux choix s’offre à vous :

Effacer les évènements listés ci dessus de votre Google Calendar. Purger seulement la database :

Cette option, vous permet d’effacer les RDV sélectionné de votre calendrier Google et de votre database.

Garder les évènements sur google calendar :

Cette option, vous permet d’effacer les RDV sélectionné uniquement de votre database gardant ainsi les évènement sur votre Google calendar.

La clé API de votre plugin doit être générée depuis “API manager” de la boutique ToTuM.

Elle est codée et criptée avec entre autre avec l’e-mail d’achat de votre plugin, votre numéro de commande et le nom de domaine sur lequel tourne le plugin.

Vous trouverez votre numéro de commande sur l’email de confirmation d’achat.

Votre clé API :

Rentrez ici votre clé API générée avec “API manager” (40 caractères).

E-mail d’achat plugin :

Rentrez ici l’e-mail que vous avez fourni lors de votre achat. C’est aussi sur cet e-mail que nous vous avons envoyé votre confirmation d’achat.

Vous pouvez changer votre e-mail d’achat en générant une nouvelle clé gratuitement sur “API manager” en cliquant sur “réinitialiser“.

Rien de plus simple :

1 – Avec votre compte Gmail, connectez vous à la search console, ou créer votre compte. Ce compte Gmail, servira également pour l’utilisation l’API Calendar de Google.

2- Dans le menu de gauche, apparait alors la liste vos propriétés (si vous en avez). Puis en bas du menu, cliquez sur “+ Ajouter la propriété”.

3 – Sélectionnez le mode de validation désiré. Je vous conseille le mode “Domaine” si vous avez accès à votre paramétrage de zone DNS. Le mode “Préfixe d’URL” vous donnera un fichier html à mettre à la racine de votre site via le FTP.

ATTENTION : si vous avez choisi “Préfixe d’URL” et que vous devez réinstaller votre site entièrement, pensez bien à sauvegarder votre fichier html de confirmation. Avec le mode “Domaine” il n’y a rien à penser, c’est juste un peu plus long, il faut juste attendre le temps de la propagation DNS, en général moins de 24h.

2 – Sur la colonne de gauche, dans “Autres agenda”, cliquer sur “Créer un agenda”.

3 – Donnez lui un nom, une description, et attribué lui le même fuseau horaire que celui qui sera attribué sur le paramétrage “Timezone” du plugin. Puis  cliquer sur “Créer un agenda”.

4 – En retournant sur le calendrier, sur la colonne de gauche, votre nouvel agenda apparait. Cliquez sur les “trois petits points verticaux”

5 – Cliquez ensuite sur “Paramètres et partage”.

6 – Descendez jusqu’à “Autorisation d’accès”, et cochez “Rendre disponible publiquement”.

7 – Veuillez noter qu’ici vous pourrez plus bas ajouter des notifications Google lors de la création de nouveaux RDV suivant vos envies de suivis.

IMPORTANT : Dans cette section, plus bas dans la page, apparait votre ID de Calendrier Google. Vous en aurez besoin dans le paramétrage du plugin WPTC.

1 – Se connecter à “Google Console API” en utilisant le même compte que celui de la “Search Console”.

2 – Si vous êtes nouveau sur Google APIs, acceptez la politique de confidentialité.

3 – Créer un nouveau projet et donnez lui un nom.

4 – Cliquez sur “+ ACTIVER DES API ET DES SERVICES”.

5 – Rechercher l’API Google Calendar, et “Activer” cette API. Votre nouveau projet apparait alors dans la liste des projets de votre compte “Google APIs”.

6 -Dans le menu, sélectionnez “Identifiant” du sous-menu “API et services”.

7 – Cliquez sur “+ CREER DES IDENTIFIANTS” puis sur “Clé API”.

1 – Dans le sous-menu “Identifiants” de “API et services”, cliquez sur “+ CREER DES IDENTIFIANTS”, puis sur “Compte de service”.

2 – Donnez un nom à votre compte de service ; par exemple “Planning de mondomaine” (il est interessant de donner un nom explicit si vous avez choisi de recevoir les notifications), et un description (facultatif).

3 – Sélectionner le rôle “Créateur de jetons du compte de service” (slider juste à coté…)

4 – Le reste étant facultatif, cliquez sur “+ CREER UNE CLE”.

5 – Sélectionner le format Json puis “Créer”.

6 – Quand vous retournez dans le sous-menu “Identifiants” de “API et services”, vous pouvez désormais télécharger votre clé au format Json. Gardez bien cette clé, car Il faudra la Zipper pour les autorisations du plugin.

La vaildation du domaine reste la partie la plus simple et pourtant la plus indispensable.

1 – Cliquez sur le sous-menu “Validation du domaine” dans le menu “API et services”

2 – Rentrez l’adresse URL de votre site web hébergeant le plugin WP ToTuM Calendar.

3 – Lorsque vous validez, votre domaine s’ajoutera à la liste des domaines autorisés.

Si vous ne parvenez pas à passer cette étape c’est que vous avez oublié de valider votre domaine avec la “Search Console”.

Impératif pour permettre à votre domaine d’acceder à l’API Google Calendar.

1 – Cliquez sur le sous-menu “Ecran d’autorisation Oauth” du menu “API et services”.

2 – Pour le paramètre “User Type”, choisissez “Externe”.

3 – Dans nom de l’application, rentrez “WP ToTuM Calendar”.

4 – Plus bas dans la page, cliquez sur “Ajouter un champs d’application” et choisissez :

• Google Calendar API ../auth/calendar.events
• Google Calendar API ../auth/calendar.readonly

les 2 champs d’applications sont obligatoires. Cliquez sur “Ajouter”.

5 – Juste dessous apparait “Domaines autorisés”. Ajouter votre nom de domaine et apuyer sur “Entrer” sinon, ce dernier ne sera pas pris en compte. Assurez vous qu’il soit bien pris en compte (slider n°7 cadre bleu)

6 – remplissez le lien de votre page d’accueil, et le lien de votre politique de confidentialité. Puis “Enregistrer”.

1 – Dans le sous-menu “Identifiants” du menu “API et services”, cliquez sur “+ CREER DES IDENTIFIANTS”.

2 – Puis  “ID Client OAuth”.

3 – Cochez “application web” dans type d’application, puis donnez le nom à l’application “WP ToTuM Calendar”.

4 – Dans Origines JavaScript autorisées” remplissez votre URL principale et appuyer sur “ENTRER” pour que votre URL soit prise en compte (slider n°4).

5 – Dans “URI de redirection autorisés”, remplissez avec le avec l’URI suivante : “https://mondomaine.com/totum-mois-jour-keep-this-page-for-plugin/. Appuyez sur “ENTRER” pour que votre URI soit prise en compte (slider n°4).

6 – Enfin cliquez sur “Créer”.

7 – Vous pouvez alors télécharger votre ID Client OAuth 2.0 au format Json (slider n°6) pour l’enregistrer dans le Back-end du plugin.

1 – Sur votre calendrier Google Calendar, sur le menu de gauche, cliquez sur les trois points verticaux (slider n°1), puis cliquez sur “Paramètres et partage” (slider n°2).

2 – Dans “Partager avec des personnes en particulier”, ajouter l’adresse Email du compte de service que vous avez créé précédement (slider n°3-4-5).

3 – Cliquez sur “Envoyer”

Pour avoir accès au calendrier Google Calendar, le plugin doit avoir l’autorisation de lecture et d’écriture sur ce dernier. Pour celà :

Votre écran autorisation d’application doit être créer avant cette manipulation.

1 – Dans le Back-end, dans les réglages du plugin, sous l’onglet “Google authentification” cliquez sur “Demande de code d’autorisation Google Calendar API”

2 – Connectez vous avec le compte où vous avez créé l’accès à API Google Calendar.

3 – Vu que l’application n’est pas encore validée (environ 6 semaines par Google), un message d’information apparait. Cliquez sur “paramètres avancés”, puis cliquer sur “Accéder à mondomaine.com (non sécurisé)”.

4 – Cliquez ensuite sur “Autoriser”. Votre code d’authenfication sera automatiquement enregistré.

Si vous voulez appliquer un paiement pour obliger l’internaute à valider sa réservation grâce à un paiement PayPal, suivez les étapes suivantes. Pour appliquer un paiement PayPal vous aurez besoin d’un compte “Businnes account” Paypal qui vous permettra de recevoir les paiements sur votre site internet. Pas de paiement ni d’abonnement, juste une validation d’identité par sécurité, et un rappel des condition d’utilisation à valider.

1 – Créer ou connectez vous sur votre compte PayPal developper.

2 – Créer une nouvelle application en cliquant sur “Create app”.

3 – Donner un nom à votre application, par exemple : “WP ToTuM Calendar” et choisissez un compte de réception de paiement.

4 – Copiez et collez les ID Client et secret vers l’onglet Back-end du plugin “PayPal”.

5 – Dans “Sanbox (ou Live) application settings” (si vous êtes san mode sandbox), ajouter “Return URL”, le lien suivant “https://mondomaine.com/totum-mois-jour-keep-this-page-for-plugin/

6 – Dans “Sandbox (ou Live) webhook” (si vous êtes san mode sandbox), ajouter “Webhook URL”, le lien suivant “https://mondomaine.com/totum-mois-jour-keep-this-page-for-plugin/

7 – Sauvegarder.

ATTENTION : si vous devez basculer le mode “Live” ou “Sandbox” du plugin WP ToTuM Calendar, les ID client et secret sont différents d’un mode à l’autre, vous aurez besoin alors de les changer dans le Back End du plugin. Vous aurez aussi besoin de vider le cache de votre navigateur.

Si vous voulez mettre en place Google Recaptcha sur le formulaire de demande de RDV de WP ToTuM Calendar suiver les étapes suivantes :

1 – Connecter vous à “Google Recaptcha console” avec le compte où vous avez validé votre domaine.

2 – Donner un nom à votre propriété.

3 – Choisissez Recaptcha v3.

4 – Rentrer le nom de domaine dans lequel il s’applique.

5 – Accepter les conditions d’utilisation, puis “ENVOYER”

6 – la clédu site et la clé scrète vous sont fournis, vous n’avez plus qu’à copier et coller ces clé sur le Back end du site d’onglet “Recaptcha” du Plugin.