Nessun piano superiore per un solo modulo
I moduli nativi Framer sono a pagamento al momento della scrittura. Un Embed col tuo HTML invia direttamente a mailcontact da ogni sito Framer pubblicato.
integrazioni · site builder
Il modo più rapido per aggiungere un modulo a Framer è un Embed di codice: poche righe HTML puntate all’endpoint mailcontact e gli invii arrivano nella casella, con avvisi Discord, Slack o email.
Framer ha componenti modulo nativi, a pagamento al momento della scrittura. Embed è diverso: markup tuo verso un endpoint esterno, funziona su ogni sito Framer senza usare le sue funzioni modulo.
Ogni casella ha anche una vera email ([email protected]) subito funzionante. Utile se la landing page Framer richiede un contatto prima di configurare la posta del dominio.
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">
<input type="text" name="name" placeholder="Your name" />
<input type="email" name="email" placeholder="[email protected]" required />
<textarea name="message" placeholder="What can we help with?" 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>
<style>
form { display: grid; gap: 8px; font-family: system-ui, sans-serif; }
input, textarea, button { padding: 10px 12px; border: 1px solid #d4d4d4; border-radius: 8px; font: inherit; }
textarea { min-height: 96px; resize: vertical; }
button { background: #111; color: #fff; border: none; cursor: pointer; }
</style>come funziona
Una casella per progetto. Chiamala come il sito Framer e ottieni subito endpoint modulo ed email.
In Framer inserisci Embed, passa a HTML e incolla lo snippet con l’ID modulo. Ridimensiona il componente per mostrare tutto il modulo.
Aggiungi Discord, Slack, email o webhook. I messaggi consegnati ti avvisano dove sei già.
perché mailcontact
I moduli nativi Framer sono a pagamento al momento della scrittura. Un Embed col tuo HTML invia direttamente a mailcontact da ogni sito Framer pubblicato.
Framer pubblica le pagine, ma dietro non c’è un tuo server. Il modulo invia direttamente a mailcontact. CORS è aperto: funzionano sottodomini framer.website e domini personalizzati.
Una landing page Framer richiede spesso anche un’email. [email protected] funziona subito, senza DNS, e arriva accanto agli invii del modulo.
FAQ
Non con questo approccio. I componenti modulo Framer sono a pagamento al momento della scrittura, ma lo snippet sopra è semplice HTML in un Embed che invia a mailcontact. Non usa le funzioni modulo di Framer.
L’endpoint risponde con un piccolo JSON: un invio nativo apre quella risposta grezza. Usa lo script MailContact ospitato nell’Embed per invio, verifica e messaggi in linea. Il reindirizzamento configurabile per invii nativi non è attualmente disponibile.
Sì, il markup è interamente tuo. L’HTML Embed non eredita gli stili Framer: includi un blocco style, come nello snippet, con font e colori del sito.
Sì. L’endpoint accetta POST da qualsiasi dominio, quindi funzionano sottodomini gratuiti e domini personali. Limiti generosi per un modulo: 20 richieste 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.