Menu
Association

Modèle de formulaire : contact association

Faciliter le premier échange avec une association sans constituer un dossier d’adhésion complet.

Aperçu local : les essais restent dans ce navigateur. Aucun message ni e-mail n’est envoyé.

Contact association

Une question, une proposition de bénévolat ou un intérêt pour l’adhésion.

1 / 1
Formeo
Personnaliser le modèle
Libellés et champs obligatoires

Renseignez votre identité, la finalité, la base légale, la rétention, le contact pour les droits et votre lien de confidentialité. Cet exemple ne constitue pas un avis juridique.

HTML / CSS autonome
<!doctype html>
<html lang="fr"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><title>Formulaire de contact</title>
<style>form[data-littlereply]{max-width:640px;margin:2rem auto;padding:1.5rem;font:16px/1.6 system-ui,sans-serif;color:#202033;background:white;border:1px solid #e4e4ee;border-radius:16px;box-sizing:border-box}form[data-littlereply] label{display:block;margin-top:1rem;font-weight:600}form[data-littlereply] input,form[data-littlereply] textarea,form[data-littlereply] select{box-sizing:border-box;width:100%;padding:.75rem;font:inherit;border:1px solid #727285;border-radius:8px;background:white;color:#202033}form[data-littlereply] input[type=checkbox],form[data-littlereply] input[type=radio]{width:auto}form[data-littlereply] button{margin-top:1rem;padding:.8rem 1.1rem;font:inherit;font-weight:600;border:0;border-radius:8px;background:var(--form-accent,#4f46e5);color:white;cursor:pointer}form[data-littlereply] :focus-visible{outline:3px solid #f59e0b;outline-offset:3px}form[data-littlereply] button:disabled{opacity:.6}form[data-littlereply] [role=status]{min-height:1.6em}form[data-littlereply] fieldset{border:0;padding:0}form[data-littlereply] .privacy-notice{font-size:.875rem;color:#4b4b60}
form[data-littlereply]{--form-accent:#4f46e5;--form-ink:#ffffff}
form[data-littlereply] button{color:var(--form-ink)}form[data-littlereply] button[data-fq-back]{background:#eee;color:#202033}form[data-littlereply] [hidden]{display:none}</style></head><body>
<form action="https://formeo.me/api/submit" method="POST" data-littlereply="YOUR_ACCESS_KEY" data-locale="fr" data-success="Votre message a bien été enregistré. L’association vous répondra prochainement.">
  <input type="hidden" name="_fq_key" value="YOUR_ACCESS_KEY" />
  <input type="text" name="botcheck" tabindex="-1" autocomplete="off" style="display:none" aria-hidden="true" />

  <label for="fq_name">Votre nom *</label>
  <input type="text" name="name" id="fq_name" required autocomplete="name" />

  <label for="fq_email">Votre adresse e-mail *</label>
  <input type="email" name="email" id="fq_email" required autocomplete="email" />

  <label for="fq_interest">Je vous contacte pour *</label>
  <select name="interest" id="fq_interest" required><option value="">—</option><option>Poser une question</option><option>Devenir bénévole</option><option>En savoir plus sur l’adhésion</option><option>Proposer un partenariat</option></select>

  <label for="fq_message">Votre message *</label>
  <textarea name="message" id="fq_message" required maxlength="5000" rows="5"></textarea>

  <button type="submit">Contacter l’association</button>
  <p role="status" aria-live="polite"></p>
</form>
<!-- Erreurs AJAX accessibles et reprises sans doublon -->
<script src="https://formeo.me/client/v1.js" data-api="https://formeo.me" defer></script>
</body></html>

Remplacez YOUR_ACCESS_KEY par la clé publique de votre propre formulaire. Le code inclut ses styles ; le script client ajoute les états AJAX. Le POST HTML fonctionne aussi sans JavaScript.

Installer ce modèle

  1. Ne demandez pas de justificatifs d’identité pour un simple premier contact.
  2. Ce modèle ne collecte ni cotisation ni adhésion contractuelle.
  3. Personnalisez la mention d’information avec les coordonnées de l’association.
  4. Créez votre formulaire depuis « Utiliser ce modèle ». Ses champs et vos personnalisations seront repris.
  5. Vérifiez le destinataire, publiez le formulaire puis remplacez la clé dans le code copié.
  6. Envoyez un test identifié et consultez le message stocké puis sa livraison.

Questions fréquentes

Ce formulaire inscrit-il automatiquement un adhérent ?

Non. Il recueille un intérêt que l’association traite ensuite.

Le modèle convient-il à une petite association ?

Oui, les champs restent limités aux informations utiles pour répondre.