Configurare Elementor Form con SendGrid SMTP

Configurare Elementor Form con SendGrid SMTP

I form Elementor di default usano la funzione wp_mail di WordPress, che spesso finisce nello spam. Configurando SendGrid SMTP garantisci consegna affidabile dei messaggi inviati dai form. Vediamo come collegare i due servizi in modo sicuro.

Perché serve un SMTP affidabile

I server WordPress condivisi hanno IP spesso blacklist-ati o senza autenticazione SPF/DKIM/DMARC. Le email inviate da wp_mail finiscono nello spam o vengono respinte. Un servizio SMTP transazionale come SendGrid garantisce reputation alta, deliverability tracciabile e report dettagliati su ogni invio.

Creare un'account SendGrid

Registrati su sendgrid.com, conferma l'email e crea una API Key con permessi Full Access (o solo Mail Send per maggiore sicurezza). Verifica anche il dominio mittente: aggiungi i record CNAME forniti da SendGrid al DNS del tuo dominio per attivare DKIM e SPF. Senza dominio verificato puoi inviare solo da indirizzi confermati singolarmente.

Plugin SMTP consigliati

WP Mail SMTP, FluentSMTP e Post SMTP supportano nativamente SendGrid. Consigliamo FluentSMTP per la sua leggerezza e per il fallback automatico (se SendGrid fallisce, prova un'altro SMTP configurato). Tutti i plugin si integrano in modo trasparente con i form Elementor.

Approfondimento tecnico

Quando si lavora con Elementor su progetti reali e fondamentale conoscere alcune sfumature spesso trascurate nei tutorial introduttivi. La prima riguarda la gestione della cache: ogni modifica significativa alla pagina richiede un refresh sia della cache server sia di quella browser; in ambienti con LiteSpeed, WP Rocket o Cloudflare APO occorre invalidare manualmente la URL modificata. La seconda sfumatura riguarda il conflitto con i Custom Post Type: i CPT registrati da plugin terzi non sempre supportano nativamente Elementor; per abilitarli vai su Elementor > Settings > General > Post Types e seleziona quelli che vuoi rendere editabili dal builder. Terza sfumatura: la gestione delle revisioni. Elementor sfrutta il sistema di revisioni nativo WordPress, quindi limita il numero di revisioni con la costante WP_POST_REVISIONS a 10 per evitare bloat del database, soprattutto su siti con tante pagine.

Consigli pratici per il workflow agency

Nel quotidiano di un'agenzia che gestisce decine di siti Elementor emergono alcune best practice trasversali. La prima e la standardizzazione: usa sempre lo stesso tema base (Hello Elementor o Astra), gli stessi widget plugin (es. Essential Addons o Happy Addons), e gli stessi plugin di caching su tutti i progetti. Così il team riconosce immediatamente l'ambiente e accelera il debug. La seconda e la creazione di una libreria interna di template: ogni volta che progetti una sezione efficace (hero, pricing, contatti) salvala come template globale. Avrai una libreria proprietaria che velocizza nuovi progetti. La terza riguarda la documentazione cliente: prepara un mini-manuale PDF di 4-5 pagine che spiega al cliente come modificare testi e immagini in autonomia, evitando ticket di supporto banali.

Considerazioni SEO e Core Web Vitals

Elementor e stato spesso accusato di generare codice pesante, ma negli ultimi due anni il team ha investito molto in performance. Gli Esperimenti attivati di default in versione 3.20+ riducono il CSS inutilizzato del 40-60%. Tuttavia per ottenere punteggi PageSpeed superiori a 90 occorre lavorare anche sul lato server (PHP 8.2+, OPcache attivo, Redis object cache se disponibile), sul lato immagini (WebP, lazy load, dimensioni corrette) e sul lato font (preload, subsetting, max 2 famiglie). Per i Core Web Vitals presta attenzione a tre metriche: LCP (mantienilo sotto 2,5 secondi: l'immagine hero deve essere ottimizzata e in eager loading), CLS (zero shift: imposta dimensioni esplicite a tutte le immagini e prenota spazio per banner dinamici), INP (interaction to next paint sotto 200ms: riduci JavaScript bloccante e widget pesanti above-the-fold).

Procedura passo-passo

  1. Installa il plugin FluentSMTP da WordPress.
  2. Vai su Impostazioni > Fluent SMTP > Add Connection.
  3. Seleziona SendGrid come provider.
  4. Incolla la API Key generata sul pannello SendGrid.
  5. Imposta From Email e From Name (l'email deve appartenere a dominio verificato).
  6. Salva e clicca Send Test Email per verificare la consegna.
  7. Apri il form Elementor in modifica.
  8. Vai su Actions After Submit > Email e configura subject, destinatario e template.
  9. Verifica che From Email coincida con quello configurato in FluentSMTP.
  10. Pubblica e fai un'invio di prova dal frontend.

Errori comuni e come risolverli

  • Email finisce in spam: verifica DKIM e SPF: il dominio mittente deve essere autenticato su SendGrid.
  • Errore 401 Unauthorized: API Key invalida o scaduta. Genera una nuova chiave su SendGrid.
  • Form invia ma email non arriva: controlla il log di FluentSMTP e l'Activity Feed di SendGrid per capire dove si interrompe il flusso.
  • From email rigettata: SendGrid blocca mittenti non verificati: aggiungi e conferma l'email o verifica il dominio.

Domande frequenti

D: SendGrid e gratuito?
R: Offre piano free con 100 email al giorno. Sufficiente per la maggior parte dei siti aziendali.

D: Posso usare lo stesso account per più siti?
R: Si, ma occhio ai limiti di invio. Per progetti grossi conviene un piano Pro.

D: In alternativa a SendGrid?
R: Brevo (ex Sendinblue), Mailgun, Amazon SES e Postmark sono alternative valide.

Hai bisogno di aiuto?

Se vuoi un sito Elementor performante realizzato dal team di G Tech Group, scrivici tramite il modulo di contatto.

Hai trovato utile quest'articolo?