Skip to content

Formulaires & newsletter

Umbraco Forms

  • Umbraco.Forms 13.6. Theme par defaut default. DisableAutomaticAdditionOfDataConsentField=true (consentement gere manuellement). EmailImageSiteDomain=accm.spektrum.media.
  • Rendu : deux points d'entree — ContactPage.cshtml (RenderForm avec Model.ContactPageForm) et Partials/Blocks/formBlock.cshtml (includeScripts=true). Le formBlock limite la largeur du form et le centre (col-12 col-lg-8 mx-auto, sans carte/ombre — refusees par le client) ; la page contact garde sa propre mise en page.
  • Bordures des controles : $form-check-input-border et $form-select-border-color surcharges dans les _bootstrap_custom.scss des 3 themes (gris ~#999 aligne sur la bordure des inputs texte) — les defauts Bootstrap etaient quasi invisibles. Focus : les vieilles ombres noires !important du base/layout/_forms.scss ont ete retirees, le focus ring Bootstrap ($input-focus-*, theme par $primary) s'applique ; accm force $input-focus-border-color: $color-black.
  • UX (module scripts/modules/forms.js) : miroir input-validation-error (aspnet-client-validation) → is-invalid (Bootstrap) via MutationObserver pour la bordure rouge des champs en erreur ; scroll + focus vers la premiere erreur au clic submit (ecoute le click, pas le submit — la lib de validation stoppe la propagation du submit invalide) ; anti double-envoi (boutons desactives apres soumission valide, spinner). Piege : l'init JS du site (index.js) passe par window.load + requestAnimationFrame → ne tourne pas dans un onglet en arriere-plan (tests automatises).
  • DatePicker : input natif type="date" (valeur ISO yyyy-MM-dd), plus de champ shadow ni de datepicker JS Umbraco Forms.
  • Styling (2026-07-15) : les partials du theme (Views/Partials/Forms/Themes/default/) utilisent exclusivement des classes Bootstrap 5 (pas de SCSS custom, conformement a la preference « utilities first ») : form-control (text, textarea, password, datepicker, fileupload), form-select (dropdowns), form-check/form-check-input/form-check-label (checkbox, dataConsent, checkboxlist, radiobuttonlist — form-check-inline si DisplayLayout horizontal), validation text-danger small d-block mt-1 (via htmlAttributes de ValidationMessage/ValidationSummary), indicateur requis text-danger ms-1, tooltip form-text, legend de champ float-none w-auto fs-6 fw-semibold (reset du reboot BS5), boutons multi-page btn btn-primary/btn-outline-secondary, submit btn btn-warning btn-send float-end (+ clearfix sur le conteneur ; pull-right BS3 remplace), message de confirmation alert alert-success. Ne pas dependre du style.min.css d'Umbraco Forms, absent quand le form a l'option « Disable default stylesheet » (cas constate sur /sondage en prod).
  • Workflow custom SendEmailViaInfomaniak (Workflows/) : envoie les emails de formulaire via le SMTP Infomaniak (mail.infomaniak.com:587, compte info@bibliocm.ch) au lieu du SMTP global Umbraco (Mailgun). Enregistre dans SiteComposer.cs. Service support : InfomaniakWorkflowEmailService (options InfomaniakSmtpOptions).
    • Herite du SendEmail standard (Umbraco Forms) : toute la composition du message (sujet, corps, tokens, destinataires, pieces jointes) est reutilisee ; seul l'envoi est redirige via une implementation custom d'IWorkflowEmailService passee au constructeur de base. Les autres formulaires (workflow standard) ne sont pas impactes.
    • Expediteur force a From = info@bibliocm.ch / FromName = Bibliotheque de Crans-Montana (Infomaniak rejette tout From != compte authentifie) ; l'adresse choisie dans l'editeur du formulaire devient le Reply-To.
  • Le SMTP global (Mailgun, info.accm@cransmontana.ch) reste utilise pour les autres emails.

Newsletter

  • INewsletterOptInService/NewsletterOptInService : inscription a la newsletter, multi-providers (config NewsletterOptInOptions : ApiUrl + liste de Clients avec client/provider/domaine/listId).
  • Cote frontend : module JS scripts/modules/newsletter.js.

Consentement

L'ajout du champ de consentement Forms est desactive automatiquement ; le consentement utilisateur (cookies/marketing) est gere via le flux cookies (voir ../architecture/frontend-build.md).

Contributors

No contributors

Changelog

No recent changes