Il backend che non devi pubblicare
L’hosting continua a servire file statici. Il POST va ai server mailcontact che validano, salvano e notificano: il pezzo dinamico mancante al sito statico.
integrazioni · approach
Puoi aggiungere un modulo funzionante a un sito statico senza scrivere o ospitare backend. Punta action dell’HTML a un endpoint che accetta il POST per te e ogni invio arriva nella casella con avvisi Discord, Slack, email o webhook. Il sito resta una cartella di file statici.
La scorciatoia mailto: fallisce in due modi: pubblica l’email nell’HTML, raccolta dai bot in pochi giorni, e funziona solo se il visitatore ha un client desktop configurato. Su molti computer non apre nulla o un’app mai configurata e il messaggio si perde senza avviso.
Un endpoint risolve entrambi: l’indirizzo non compare nel markup e l’invio è un normale POST HTTP, disponibile in ogni browser. mailcontact valida i campi, salva e notifica il canale scelto, con lo stesso flusso per HTML manuale, output di generatori o vecchie pagine ereditate.
configurazione consigliata
Aggiungi questo HTML al sito oppure usa generatore di moduli. Sostituisci il link del modulo con il tuo. Lo script ospitato inserisce il controllo nascosto, gestisce invio e verifica automatica e conserva la bozza in caso di errore. Tu controlli HTML e CSS. I moduli Free mostrano un link visibile “Processed by mailcontact.app”; Pro e Plus no. I messaggi seguono la lingua del browser; imposta data-mailcontact-language="fr" sul modulo per impostare il francese.
<form action="https://mailcontact.app/api/forms/your-form-id" method="POST" data-mailcontact-form lang="it" data-mailcontact-language="it">
<input type="hidden" name="_language" value="it" />
<fieldset>
<legend>Contattaci</legend>
<label>
Nome (facoltativo)
<input name="name" type="text" autocomplete="name" maxlength="200" />
</label>
<label>
Email
<input name="email" type="email" autocomplete="email" maxlength="320" required />
</label>
<label>
Messaggio
<textarea name="message" rows="5" maxlength="5000" required></textarea>
</label>
<noscript>
<div aria-hidden="true" style="position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden;">
<label>Sito web
<input name="company_website" type="text" tabindex="-1" autocomplete="off" />
</label>
</div>
</noscript>
<button type="submit">Invia messaggio</button>
</fieldset>
<p data-contact-status role="status" aria-live="polite" aria-atomic="true"></p>
</form>
<script defer src="https://mailcontact.app/forms/v1.js" crossorigin="anonymous" referrerpolicy="no-referrer"></script>Per un componente con un proprio gestore di invio, carica lo stesso script e usa MailContact.prepare(form) e MailContact.send() al posto del marcatore automatico. Consulta riferimento per interfacce personalizzate per caricamento, messaggi e attribuzione Free.
lo snippet
Questo esempio invia direttamente all’API. Mantieni il campo obbligatorio company_website presente e vuoto. Gli invii nativi aprono JSON in caso di successo o una pagina di verifica se serve. Gli script personalizzati senza supporto alla verifica inviano i messaggi sospetti in Spam per revisione; anche lo spam evidente resta lì senza notifiche né consumo di quota. Una risposta di successo conferma la ricezione, anche per revisione, oppure lo scarto silenzioso di un controllo compilato. Vedi protezione antispam per il comportamento completo.
<form action="https://mailcontact.app/api/forms/your-form-id" method="POST">
<label for="name">Name</label>
<input id="name" type="text" name="name" />
<label for="email">Email</label>
<input id="email" type="email" name="email" required />
<label for="message">Message</label>
<textarea id="message" name="message" rows="5" required></textarea>
<button type="submit">Send</button>
<input name="company_website" type="text" tabindex="-1" autocomplete="off"
style="position:absolute;left:-10000px" aria-hidden="true" />
</form>come funziona
Una casella per progetto. Chiamala come il sito e ottieni subito URL endpoint ed email. Niente DNS o server di posta.
Copia lo snippet in una pagina HTML e sostituisci your-form-id con l’endpoint. I nomi dei campi (name, email, message) sono tutto ciò che serve all’endpoint.
Aggiungi un canale Discord, Slack, email o webhook. I nuovi messaggi appaiono in casella e ti avvisano appena arrivano.
perché mailcontact
L’hosting continua a servire file statici. Il POST va ai server mailcontact che validano, salvano e notificano: il pezzo dinamico mancante al sito statico.
Niente link mailto:, span offuscati o indirizzi da raccogliere. I visitatori vedono il modulo; l’email della casella resta privata.
Lo snippet è HTML semplice. Funziona in pagine manuali e output di ogni generatore. Nessun bundler, framework o tag script obbligatorio.
FAQ
Completamente. HTML e CSS sono tuoi. L’endpoint considera solo i nomi dei campi: email e message sono obbligatori, name e subject facoltativi; anche company_website deve essere presente e vuoto. Tutto il resto del markup dipende da te.
L’invio nativo del modulo mostra attualmente la risposta JSON dell’endpoint; per l’esperienza migliore usa lo script MailContact ospitato: invia i campi, gestisce la verifica e mostra i messaggi nella pagina. Il reindirizzamento configurabile per gli invii nativi non è attualmente disponibile.
Qualunque hosting: GitHub Pages, Netlify, Vercel, Cloudflare Pages, un bucket S3 o nginx che serve una cartella. Il modulo invia ai server mailcontact e le richieste sono accettate da qualsiasi origine: non devi configurare nulla sull’hosting.
Free include un progetto, un modulo e 50 invii al mese, con canali di notifica. Pro aggiunge email di ricezione, dieci progetti e 1.000 messaggi al mese per l’account. Le richieste modulo sono limitate a 20 al minuto per IP.
correlati
Moduli e un vero indirizzo email insieme, con notifiche dove lavori. Inizia con un account gratuito.
Crea un modulo gratisNon serve la carta di credito. Free include un progetto e 50 messaggi dal modulo al mese.