Insky (Créer un compte)

Je vois surtout que j’ai encore de beaux progrès à faire sur la compréhension globale. Vos retours sont vraiment instructifs.

UAEL est une extension d’elementor. Je n’avais jamais utilisé sur le même site CF7 et UAEL mais tout est clair maintenant. UAEL propose un widget pour différentes extensions de formulaires, dont CF7 – qui rajoutent tout un tas d’options de mise en forme etc… dont je n’avais pas besoin mais qui sont toutes actives par défaut!

J’ai donc pris le problème dans le bon sens, en désactivant les modules de formulaire d’UAEL et bien entendu, tout est rentré dans l’ordre.

Un immense et sincère merci pour tout ce temps accordé!

Je ne comprenais pourquoi il y avait autant de marge entre la case et le libellé, cela a attiré mon attention.
En ajoutant le code ci-dessus, cela fonctionnement uniquement pour l’option choisie (les ombres restent pour les autres).

J’ai tenté de rajouter une autre pseudo-classe (:default et :blank) mais cela n’a aucun effet sur les options non choisies.

Laurent

Re,
En effet, j’avais oublié de nommer différemment « Garde-corps », merci. C’est corrigé.

Je viens de modifier le code en reprenant le vôtre mais cela ne change rien (mis à part enlever les bordures autour). Toujours impossible de cliquer. Voici le contenu du code mis à jour.

Je n’avais pas dans mon code la classe suivante mais je l’ai ajouté :

.uael-cf7-style

input.image-radio {height: 135px; width: 135px;}

input.image-radio:after { 
    background-image: url('https://www.lela3644.odns.fr/wp-content/uploads/2023/11/devis-escalier-droit-simple.jpg');
    content: '';
    width: 135px;
    height: 135px;
    display: inline-block;
    background-size: contain;
	background-repeat: no-repeat;
}


#main .wpcf7-list-item-label:before{
  border:none;
}
.uael-cf7-style .wpcf7-radio input[type="radio"][name="image-radio"]{
	display:none;}

.image-radio .wpcf7-list-item-label {cursor: pointer; border:solid 1px #ccc; margin:5px; padding: 135px 0px 0px 0px; height: 135px !important; width:135px !important; background-color: #fff; display: block; opacity: 0.45; text-align: center;}
.image-radio input[type="radio"]:checked + span.wpcf7-list-item-label, .image-radio .wpcf7-list-item-label:hover {opacity: 1 !important; color: #000; border:solid 1px #000;}
.image-radio input[value="Escalier droit simple"] + span.wpcf7-list-item-label {background: transparent url("https://www.lela3644.odns.fr/wp-content/uploads/2023/11/devis-escalier-droit-simple.jpg") no-repeat scroll center;}
.image-radio input[value="Escalier 1/4 tournant"] + span.wpcf7-list-item-label {background: transparent url("https://www.lela3644.odns.fr/wp-content/uploads/2023/11/devis-escalier-quart-tournant.jpg") no-repeat scroll center ;}
.image-radio input[value="Escalier 2/4 tournant"] + span.wpcf7-list-item-label {background: transparent url("https://www.lela3644.odns.fr/wp-content/uploads/2023/11/devis-escalier-2-quart-tournant.jpg") no-repeat scroll center;}
.image-radio input[value="Escalier hélicoïdal rond"] + span.wpcf7-list-item-label {background: transparent url("https://www.lela3644.odns.fr/wp-content/uploads/2023/11/devis-escalier-helicoidal-rond.jpg") no-repeat scroll center;}
.image-radio input[value="Escalier hélicoïdal carré"] + span.wpcf7-list-item-label {background: transparent url("https://www.lela3644.odns.fr/wp-content/uploads/2023/11/devis-escalier-helicoidal-carre.jpg") no-repeat scroll center;}

Je viens de me rendre compte qu’en fait le carousel se stoppe si on le survole. Comme la zone est grande, si on laisse trainer le curseur dans cette partie de l’écran, çà ne bougera plus.

Par contre il y avait une transition très simple (fondu) qui n’y est plus et effectivement le défilement est rapide.

Il n’y a pas d’extension, c’est un carousel issu de bootstrap 5 intégré directement.

Bonjour @mathieu42,

Merci pour le retour. Entre temps j’ai réussi à avancer sur le problème de CSS. J’ai joué avec certains media queries. Il me semble que c’est mieux ?

Pour la parenthèse RGPD, a priori, cela le respecte. J’ai bien relu ce lien que je connaissais. Il est préconisé de faire apparaître un bouton identique pour refuser mais ce n’est pas imposé. Le fond est imposé (l’internaute doit pouvoir exprimer son refus), la forme n’est que conseillée. De préciser d’ailleurs « En revanche, la seule présence d’un bouton « Paramétrer » en complément du bouton « Tout accepter » tend, en pratique, à dissuader le refus et ne permet donc pas de se mettre en conformité ».

L’absence de conformité est manifeste lorsque il n’y a pas aucun moyen de refuser, mais pas si le moyen de refuse diffère sur la forme que l’acceptation. J’ai néanmoins pris la remarque en compte. Le bandeau a été mis à jour.

Bonjour,

Je réponds point par point :

• Concernant les 3 logos. Il y a le logo « normal » quand on arrive sur la page (pleine taille, blanc), puis le logo dès qu’on commence à scroller (marron, plus petit) et enfin celui qui apparait au clic sur le toggle du hamburger en version mobile. Notre petit groupe n’est pas du tout expert en développement web. On a eu pas mal de mal à faire çà déjà (gérer le changement de menu au scroll en JS + css).
• Ok pour le logo mobile. On va tester çà. Pour le padding, c’était un essai que j’ai fait juste après mon précédent message pour voir si çà pouvait fonctionner.
• Pour le visuel du bas, il y a en fait 3 images différentes (oiseaux en top left, oiseaux en top right et scène paysanne en bas). Je ne sais pas si on peur assigner des « contain » sur différentes images de fond ?
• Pour le formulaire, oui on s’en est rendu compte aussi et c’est moins pire que lorsqu’on l’a pris. C’est un formulaire provenant de Sendinblue car les contacts doivent partir directement en base de données sur cet outil, mais il n’est pas au point effectivement. On va essayer d’améliorer encore son comportement.

Je suis bien d’accord pour les constructeurs, mais dans le cadre de la formation, il est strictement interdit d’utiliser un thème existant, un constructeur de page ou tout autre extension apportant du confort aux outils natifs prévus dans WordPress. Dans le cadre de ce projet, on n’a aucune obligation de résultat, seulement de « galérer » à faire par nous-même (mais forcément, on veut livrer quelque chose d’aussi « propre » que possible.

Je n’aborde pas encore notre gros morceau : les CPT ! C’est la prochaine grosse étape qu’on doit faire par nous-même (possibilité de les créer par une extension mais pour les afficher, on devra créer nos fichiers en php).