Come inviare e-mail HTML con Gmail

Come inviare e-mail HTML con Gmail

Scopri come creare email HTML in Gmail che contengono tabelle, pulsanti, caratteri personalizzati, stili CSS incorporati, query multimediali, emoji e persino firme HTML.

Come inviare e-mail HTML con Gmail

Questo tutorial descrive come inviare facilmente email HTML in Gmail senza utilizzare alcuna estensione. Puoi formattare i tuoi messaggi Gmail in modo da includere tabelle, pulsanti, caratteri personalizzati, icone di social media, immagini a capo attorno al testo e altro ancora. Un po ‘di conoscenza di HTML e CSS tornerà utile ma non è un prerequisito.

L’editor WYSIWYG integrato di Gmail offre opzioni di formattazione di base: puoi rendere il testo in grassetto, creare elenchi, modificare i colori dei caratteri, ma è praticamente tutto. Non è possibile inserire HTML personalizzato nel corpo del messaggio necessario per inviare messaggi di posta elettronica ricchi tramite Gmail.

Scrivi email HTML direttamente in Gmail

Iniziamo con alcuni esempi di base e poi passiamo a esempi più avanzati in cui imparerai come inviare newsletter via email che sono state create separatamente all’interno di MailChimp.

Inserisci pulsanti in Gmail

Questo frammento HTML crea un bellissimo pulsante di invito all’azione con uno sfondo blu, bordi leggermente arrotondati e reso nel popolare carattere Roboto.

<a
  href="https://bloggeritaliano.com/"
  style="background-color:#1a73e8; padding:10px 20px;
         color: white; text-decoration:none; font-size:15px;
         font-family:Roboto,sans-serif; border-radius:5px;
         display:block; margin:20px 0; width: 120px"
  >Ciao
</a>

Non possiamo copiare e incollare questo HTML direttamente nell’editor di posta elettronica di Gmail, ma con la magia di Chrome Dev Tools , possiamo. Vediamo come:

Apri gmail.com e componi un nuovo messaggio di posta elettronica. Aggiungi un’emoji nel corpo del messaggio da sostituire con il pulsante HTML. Fai clic con il pulsante destro del mouse sull’emoji nell’editor di Gmail e scegli Ispeziona.

Questo apre gli strumenti per sviluppatori nella metà inferiore del browser. Seleziona il <img>tag che contiene l’emoji, fai clic con il tasto destro e scegli Editor HTML. Sostituisci il contenuto selezionato con il pulsante HTML e fai clic in un punto qualsiasi al di fuori della finestra degli strumenti di sviluppo.

Ora vedrai un bellissimo pulsante HTML reso nel tuo messaggio di posta elettronica con tutti gli stili e la formattazione CSS. 

Inserisci tabelle HTML in Gmail

Nel prossimo esempio, incorporeremo una tabella HTML nell’editor di Gmail. A differenza del nostro pulsante sopra che aveva tutti gli stili inline, il CSS della tabella è contenuto in un foglio di stile separato.

Pertanto, prima di incollare il codice HTML della tabella in Gmail, dobbiamo “inline” gli stili altrimenti la formattazione verrà ignorata da Gmail. Questo può essere fatto facilmente tramite Juice : incolla semplicemente HTML e CSS nella casella di input e inserirà tutti gli stili CSS nei tag HTML compatibili con Gmail.

Come inviare e-mail HTML con Gmail

Invia newsletter via email con Gmail

Fino ad ora abbiamo visto esempi di aggiunta di blocchi HTML di base all’interno di Gmail, ma non sarebbe bello se potessimo inviare newsletter e-mail professionali e reattive tramite Gmail?

Se sei nuovo, il termine responsive significa essenzialmente che gli stili cambiano automaticamente in base al dispositivo dell’utente. Quindi, se qualcuno sta visualizzando l’e-mail su un telefono cellulare, vedrebbe un layout diverso rispetto a una persona che ha aperto la tua e-mail su un computer desktop.

Puoi utilizzare MailChimp o qualsiasi altro designer di modelli di email per creare la newsletter. L’unico requisito è che lo strumento abbia un’opzione per scaricare i progetti come file HTML.

Puoi inserire questo file HTML in Juice per incorporare gli stili CSS e quindi inserire l’HTML trasformato in Gmail usando il trucco delle emoji. La bozza di newsletter può essere utilizzata anche come modello per l’invio di e -mail personalizzate con Stampa unione .

Leggi Anche : Effetti di Google Meet

Summary
Come inviare e-mail HTML con Gmail
Article Name
Come inviare e-mail HTML con Gmail
Description
Scopri come creare email HTML in Gmail che contengono tabelle, pulsanti, caratteri personalizzati, stili CSS incorporati, query multimediali, emoji e persino firme HTML.
Author
Publisher Name
Bloggeritaliano.com
Publisher Logo

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *