Insérer un checkbox sur mon site web

Version imprimable

06/12/2022, 15h47
VasantV

Insérer un checkbox sur mon site web

Bonjour,
j'ai créé mon site web avec Zyro: medecinechinoiseannecy.fr

Je souhaiterais ajouter une checkbox et Zyro ne propose pas cette option. Il faut donc que j'insère un code mais je ne sais pas coder.

Pourriez-vous m'aider, svp?

Voici ce que je veux créer:

Texte: J'ai lu et j'accepte les CGU (avec lien direct vers les CGU)

Checkbox à cocher pour signifier l'accord

Bouton "Je prends rendez-vous", utilisable uniquement si la check box est cochée, et qui renvoie vers le site de prise de rendez-vous

Le tout dans un format qui correspond à celui utilisé sur le site si possible

Quelqu'un pourrait m'aider ?

Merci beaucoup
09/12/2022, 00h10
laurentSc
Bonsoir,

Moi, j'aurais utilisé le CMS Wordpress (le plus utilisé au monde) qui te permettrait cela.

Néanmoins, en gros, il est nécessaire d'ajouter un formulaire html dont le seul champ serait une checkbox et son action (un fichier PHP) testerait la valeur de la checkbox et si elle vaut true alors il affiche le texte Je prends rendez-vous à l'intérieur d'un bouton, et celui-ci faisant un lien vers https://soins.calendoc.net/pro/4907/890293809249631. C'est OK ?

Code pour le formulaire html :
Code:

1 2 3 4 <form method="POST" action="action-chkbox.php"> <input type="checkbox" name="rdv" action="prendre-rdv.php"> <input type="submit" value="je prends rdv"> </form>
Code de prendre-rdv.php :
Code:

1 2 3 4 if ($_POST['rdv']) /* si ça vaut true, c'est que la chkbox est cochée */ { //on affiche le texte dans un bouton et autour de celui-ci, on place un lien html }
C'est l'idée mais je m'arrête ce soir...
09/12/2022, 10h14
VasantV

Bonjour LaurentSc

Merci beaucoup pour ta réponse. C'est sympa d'avoir passé du temps pour m'aider.
Ton code fonctionne mais il manque la partie " J'accepte les conditions générales d'utilisation"
En gros, je voudrais un truc comme ça:
□ J'ai lu et j'accepte les CGU ( avec lien vers les CGU)
si la case est cochée: bouton " Je prends RDV" qui envoie vers le site de rendez-vous

Merci encore

Code:

1
2
3
4
5
<form method="POST" action="action-chkbox.php">
<input type="checkbox" name="rdv" id="chkb" action="prendre-rdv.php">
<label for="chkb">J'ai lu et j'accepte les CGU (<a href="cgu.html">CGU</a>)</label>
<input type="submit" value="je prends rdv">
</form>

Si tu veux, je te donne aussi un code (html + css) pour que le fichier php affiche un bouton...

09/12/2022, 14h42
VasantV

Bonjour LaurentSc

Merci encore pour ton aide ! C'est super
Je veux bien, si tu as encore un peu de temps, que tu insères un bouton qui renvoie vers le site de rendez-vous...
En fait, je sais insérer un code sur ma page mais je ne sais pas le créer !
Si tu veux voir mon site, c'est medecinechinoiseannecy.fr.
Tu verras, il y a des boutons d'accès aux rendez-vous un peu partout !
Merci encore pour ton aide
Anne-C
09/12/2022, 14h54
laurentSc

Je viens de regarder le code d'un des boutons (avec l'inspecteur) mais avec Zyro, le code est un peu compliqué. Comme j'ai déjà fait ça pour mes besoins, j'ai beaucoup plus simple...Petite question : je suppose que ton site doit être "responsive" (qu'il tourne aussi bien sur ordi que sur mobile). Me le confirmes tu ?

Voici un code de bouton "responsive" :

Code:

<a href="https://soins.calendoc.net/pro/4907/890293809249631"><div class="box offset-bottom-right-shadow"><span class="btn-contact">Prendre RDV</span></div></a>

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
/* Boutons coins arrondis */
.box {
    text-align: center;
    margin-bottom: 30px;
    padding: 50px 0px;
    background-color: white;
    color: black;
    vertical-align: middle;
}
 
.offset-bottom-right-shadow {
    border-radius: 2em;
    box-shadow: 0px 5px 10px;
}
 
 
@media (min-width: 800px) {
  .box{
    width:10%;
  }
    .btn-contact{
        display:block;
        font-size:20px;
    }
}
@media (max-width: 800px) {
   .box{
    width:30%;
  }
    .btn-contact{
        display:block;
        font-size:20px;
    }

https://codepen.io/laurentsch/pen/jOKRboV

09/12/2022, 19h30
VasantV

C'est canon, Merci laurent,
... Mais je fais comment pour intégrer le CSS au cade Html ?
J'ai plein de qualités... mais vraiment pas en inormatique !
En tous cas, si tu passes par Annecy, je t'offre une séance de médecine Chinoise !
09/12/2022, 19h52
mathieu
si vous pouvez mettre du code html, vous pouvez y mettre des balises style et mettre le code css à l'intérieur :
Code:

1 2 3 4 5 6 7 <style> .box { text-align : center; ... </style>
09/12/2022, 22h04
laurentSc
mathieu t'a indiqué une solution :
Code:

1 2 3 4 5 <style> text-align : center; ... </style> <a href="...">...</a>
Mais tu peux aussi intégrer le CSS dans la partie <head> de ton site : https://support.zyro.com/en/articles...website-s-code auquel cas dans le <head> tu mets simplement :
Code:

1 2 3 4 <style> text-align:center; ... </style>
et tu insères le code html comme tu sais le faire.
09/12/2022, 22h22
VasantV

Super Mathieu Laurent!
On progresse, on progresse ; J'ai réussi à insérer CSS dans le html !
https://medecinechinoiseannecy.fr/testcode

Cependant il me reste quelques problèmes:
1- Je peux prendre rendez-vous même si je ne coche pas les CGV
2- Je voudrais pouvoir ouvrir mes CGV dans un nouvel onglet
3. Je voudrais pouvoir prendre rendez-vous dans un nouvel onglet

Merci encore
AnneC
09/12/2022, 22h54
laurentSc

Je découvre Zyro. Mais j'ai vu qu'on ne peut pas insérer un formulaire en mettant juste son code html, comme on vient de faire ; il faut utiliser le module "contact form" : https://support.zyro.com/en/articles...a-contact-form

Pourquoi avoir choisi ce logiciel peu connu et ne disposant pas d'une communauté qui pourrait t'aider (comme Wordpress) ?
09/12/2022, 23h23
laurentSc

Citation:

Envoyé par VasantV

Je voudrais pouvoir prendre rendez-vous dans un nouvel onglet

Code:

<a href="https://soins.calendoc.net/pro/4907/890293809249631" target="_blank"><div class="box offset-bottom-right-shadow"><span class="btn-contact">Prendre RDV</span></div></a>
12/12/2022, 12h01
VasantV

Bonjour
Merci encore pour votre aide, Je vais maintenant pouvoir me débrouiller avec tout ce que vous m'avez enseigné !
J'ai choisi Zyro car je voulais faire mon site seule et que c'est beaucoup plus simple que Wordpress. Leur seul problème est qu'ils n'ont pas de boutons
Merci encore pour votre aide et belles fêtes de fin d'année
AnneC
12/12/2022, 12h19
laurentSc

Bonjour,
pourtant, y a bien un bouton, ici : https://support.zyro.com/fr/articles...-d-un-site-web...