Come personalizzare le e-mail di WooCommerce utilizzando codice e plugin?

Salve utenti di WooCommerce! Se vuoi costruire la tua identità di marca unica e incoraggiare gli acquisti ripetuti, puoi farlo facilmente con i modelli di email WooCommerce personalizzati.

Ti guideremo attraverso i modelli di e-mail WooCommerce predefiniti, come personalizzarli con il codice e quali plug-in di personalizzazione delle e-mail WooCommerce funzionano meglio per te.

Iniziamo.

Modelli di email WooCommerce standard: tipi e contenuto

In sostanza, WooCommerce è dotato di undici modelli di e-mail integrati che vengono inviati ai clienti e agli amministratori relativi agli ordini e agli aggiornamenti dell'account.

• E-mail di sospensione dell'ordine : inviata al cliente dopo che un ordine è stato sospeso.
• Email di elaborazione dell'ordine : inviata al cliente dopo che il pagamento è stato effettuato.
• E -mail ordine completato : inviata ai clienti quando i loro ordini sono contrassegnati come completati e indica che l'ordine è stato spedito.
• E-mail di rimborso dell'ordine : inviata al cliente quando gli ordini sono contrassegnati come rimborsati.
• Nuovo ordine : inviato all'amministratore del negozio quando viene effettuato un nuovo ordine sul loro sito.
• Ordine annullato : inviato all'amministratore del negozio per informarlo di un ordine annullato.
• Ordine non riuscito : inviato all'amministratore del negozio per informarlo di un ordine non riuscito.
• E -mail fattura cliente : inviata al cliente e contiene informazioni sull'ordine e collegamenti di pagamento.
• Email nota cliente : inviata al cliente quando viene aggiunta una nota cliente dall'amministratore dell'ordine di modifica.
• Email di reimpostazione della password: inviata al cliente quando dimentica la password e richiede una nuova password.
• E-mail del nuovo account : inviata al cliente al momento della registrazione tramite la pagina di pagamento o di registrazione dell'account.

Un'e-mail di esempio con l'ordine completato ha l'aspetto dell'istantanea qui sotto.

In breve, le e-mail consistono nei seguenti dettagli: informazioni sul prodotto, prezzo totale comprensivo di tasse e spese di spedizione, modalità di pagamento, indirizzo di spedizione e fatturazione.

Ma questi modelli di email WooCommerce semplicemente non lo tagliano

Essendo un'e-mail transazionale, le percentuali di apertura e di clic saranno naturalmente superiori rispetto ad altri tipi di e-mail.

Queste e-mail di ordine WooCommerce, tuttavia, sembrano semplici, noiose e poco attraenti, come puoi vedere dal modello di e-mail sopra.

Manca il fattore grinta. Non porta il tuo marchio e posizionamento. Si riflette male sulla tua proposta di valore.

Se continui a utilizzare questi modelli, i tuoi consumatori, compresi i tuoi fedeli, potrebbero avere un'impressione negativa del tuo marchio, con conseguente aumento del tasso di abbandono.

Mi dispiace dirlo ma questo è vero. Una grande occasione persa!

Otto persone su dieci non cambieranno mai i propri modelli di posta elettronica. Se sei uno di loro, cambia subito.

Tutti leggono ancora le e-mail … e dovresti avere un bell'aspetto in esse. Non vuoi dare ai tuoi clienti una cattiva impressione del tuo marchio se decidono di acquistare qualcosa, vero?

Quindi, perché non personalizzare le e-mail di WooCommerce in primo luogo?

Le e-mail WooCommerce personalizzate creano un marchio e una relazione unici

La personalizzazione delle e-mail di WooCommerce non è una scienza missilistica da comprendere. Piuttosto una passeggiata (se usi i plugin). Si può giocare con gli stili dell'e-mail, i colori, l'allineamento, le immagini e molto altro.

Confronta il modello di email sopra (fornito dal plugin Email Customizer Pro per WooCommerce) con l'email WooCommerce predefinita. Noteresti facilmente la differenza.

Dalla loro e-mail iniziale, possiamo dedurre la loro immagine del marchio. Perché abbiamo una predisposizione naturale ad essere eccitati dai colori e dalle fantasie che percepiamo. L'uso dei colori, dei caratteri e del linguaggio del tuo marchio stabilisce coerenza e rafforza il tuo marchio. Crei uno swag tutto tuo .

Con ogni dollaro speso per l'email marketing, è possibile guadagnare una somma massima di $ 38 , fatto provato.

La tua azienda trae vantaggio dal senso di connessione emotiva. I clienti diventano i tuoi devoti fan a lungo termine. Dà al tuo marchio più trazione.

Aiuta nel tuo richiamo. Inoltre, l' inclusione di prodotti correlati e codici coupon può comportare acquisti aggiuntivi .

Detto questo, queste e-mail transazionali WooCommerce personalizzate sono un punto di aggancio con i tuoi clienti. Nel momento in cui blocchi il tuo pubblico di base, il business prende ritmo e i dati finanziari sembrano promettenti.

Come personalizzare le email WooCommerce usando il codice?

Ti guideremo attraverso il processo di personalizzazione di queste e-mail ora.

Cosa ti piace fare? Adotta un approccio semplice utilizzando i plug-in e inizia. O vuoi sperimentare con la codifica?

Entrambi sono discussi in questo articolo.

Personalizziamo le email di WooCommerce usando il modo tecnico. Successivamente, esamineremo diversi plugin popolari.

Personalizza le email di WooCommerce usando Impostazioni, Ganci e Filtri

Questa non è la tazza di tè di tutti. Questo è per le persone che conoscono la programmazione.

Ora ci sono due metodi per personalizzare le email con il codice.

1. Personalizza i modelli di email WooCommerce già esistenti
2. Usando il codice personalizzato, crea nuovi modelli di email WooCommerce

Tratteremo il primo metodo. Per il secondo metodo, fai riferimento a questo blog: crea modelli di email WooCommerce personalizzati.

Essenzialmente WooCommerce consente di personalizzare le e-mail in tre diversi verticali: impostazioni, sovrascrittura e azione/filtri (ganci).

1. Impostazioni : è possibile modificare il colore di sfondo, il colore del testo, il colore di base. Il problema si presenta sotto forma di limitazione di eventuali modifiche al layout e al corpo dell'e-mail.
2. Sostituzione : nel caso in cui desideri modificare il layout dell'e-mail, puoi modificare l'HTML del modello.
3. Hook : oltre alle modifiche di cui sopra, puoi anche aggiungere contenuti aggiuntivi tramite hook senza disturbare il layout.

Impariamo ciascuno dei tre in dettaglio.

Personalizzazione dei modelli di posta elettronica utilizzando le Impostazioni

Per prima cosa, vediamo come personalizzare un modello di email individualmente.

Per questo, devi aprire il modello facendo clic sul nome del modello o sul pulsante Manage a destra.

Puoi personalizzare il contenuto di un singolo modello di email. Una volta aperto un modello di email, puoi personalizzarne diversi aspetti. Queste sono le opzioni che ottieni come mostrato nell'immagine (cortesia – LearnWoo.com)

• Abilita/Disabilita: questa casella di controllo che consente di abilitare o disabilitare questa specifica notifica e-mail.
• Destinatari: specificare gli ID e-mail a cui verrà inviata questa e-mail. Separa più ID e-mail usando la virgola. Questo è applicabile solo alle e-mail dell'amministratore.
• Oggetto: specificare qui l'oggetto dell'e-mail. Il campo consente testo o segnaposto. I segnaposto disponibili sono:
  • {site_title}
  • {indirizzo del sito}
  • {indirizzo del sito}
  • {data dell'ordine}
  • {numero d'ordine}
• Intestazione e-mail: specificare l'intestazione dell'e-mail. Gli stessi segnaposto di cui sopra sono applicabili anche qui.
• Contenuto aggiuntivo: il testo che aggiungi qui sarà visibile nel corpo dell'e-mail. Puoi usare anche i segnaposto qui.
• Tipo e-mail: specificare il formato dell'e-mail. I formati disponibili sono:
  • Testo normale
  • HTML
  • Multiparte

Modello HTML
C'è un'opzione alla fine dell'impostazione sotto l'intestazione Modello HTML. Qui troverai il percorso del file che ti consente di modificare questa specifica copia del modello di email, che puoi incollare nella cartella del tema per sovrascriverla. Ci sono anche due pulsanti qui: uno per copiare il file del modello sul tema e un altro per visualizzare l'anteprima del modello.

Infine, dopo aver aggiunto tutti i dettagli, puoi fare clic sul pulsante Save changes .

Ora puoi applicare alcune ulteriori personalizzazioni che saranno applicabili a tutti i tuoi modelli di email. È possibile accedere a queste opzioni dopo aver effettuato l'accesso al pannello di amministrazione di WordPress e quindi andando su WooCommerce > Settings > Emails > Email sender options.

Queste opzioni includono:

• Immagine intestazione: viene visualizzata in cima a tutte le e-mail. Deve essere il logo del tuo marchio.
• Testo del piè di pagina: aggiungi il collegamento al tuo sito Web o i dettagli di contatto per consentire ai tuoi clienti di mettersi in contatto facilmente.
• Colore di base: il colore che desideri utilizzare per le intestazioni, i collegamenti e lo sfondo del titolo dell'e-mail.
• Colore di sfondo: il colore di sfondo della tua email.
• Colore di sfondo del corpo: il colore dello sfondo del contenuto dell'e-mail.
• Colore del corpo del testo: il colore di tutto il contenuto dell'e-mail scritta.
• Approfondimenti sulla gestione del negozio: accedi per ricevere approfondimenti sulla gestione del negozio da WooCommerce qui. Spunta la casella per abilitare queste notifiche.

In questo approccio,

Sovrascrivere i modelli di posta elettronica

Un altro approccio consiste nel modificare i layout di posta elettronica predefiniti. WooCommerce offre un utile sistema di modelli che ti consente di personalizzare parti di e-mail replicando i file di formato nel tema.

Ogni tipo di email ha un file modello per il suo contenuto. (Ad esempio, woocommerce/templates/emails/customer-processing-order.php )

Per ciascuna delle undici e-mail WooCommerce predefinite, ecco il nome del file modello. A cosa serve ogni e-mail è già spiegato all'inizio dell'articolo.

1. admin-cancellato-ordine.php
2. admin-fallito-ordine.php
3. admin-nuovo-ordine.php
4. cliente-in-attesa-ordine.php
5. ordine-elaborazione-cliente.php
6. ordine-completo-cliente.php
7. ordine-rimborso-cliente.php
8. nota-cliente.php
9. fattura-cliente.php
10. cliente-nuovo-account.php
11. cliente-reset-password.php

Inoltre, ci sono modelli condivisi a cui tutti i tipi di email possono accedere e utilizzare. Questi possono essere trovati su woocommerce/templates/emails/ .

In molti casi, questo è il modello che gli sviluppatori sovrascrivono per modificare gli aspetti condivisi delle e-mail.

Di seguito sono elencate diverse parti che formano l'e-mail sopra, ognuna è personalizzabile.

1. email-header.php = stampa/mostra l'intestazione dell'e-mail.
2. email-footer.php = stampa/mostra il footer dell'email.
3. email-order-details.php = stampa/mostra tutti i dettagli dell'ordine: prodotti/articoli pubblicitari, tasse, spedizione, coupon, gateway di pagamento, ecc. per quell'ordine.
4. email-order-items.php = stampa/mostra i dettagli del prodotto dell'ordine, ad esempio gli elementi pubblicitari per quell'ordine.
5. email-downloads.php = se un ordine contiene prodotti scaricabili, questo stampa/mostra tali informazioni insieme al nome del file, al link per il download, alla scadenza, al numero di download, ecc. per quell'ordine.
6. email-customer-details.php = stampa/mostra i dettagli del cliente come un indirizzo email per quell'ordine.
7. email-addresses.php = stampa/mostra l'indirizzo di fatturazione e spedizione del cliente per quell'ordine.
8. email-styles.php = contiene CSS e proprietà che verranno applicate nelle email. Dovrebbe essere sicuro per la posta elettronica.

Diciamo che vuoi cambiare il colore del testo del piè di pagina:

• Per prima cosa assicurati che la seguente directory esista nell'installazione di WordPress: wp-content/themes/your-theme/woocommerce/emails.
• Quindi, copia il file trovato su wp-content/plugins/woocommerce/templates/emails/email-styles.php nel tema del negozio su:
  your-theme/woocommerce/emails/.
• Infine, modifica your-theme/woocommerce/emails/email-styles.php per cambiare il colore del testo del piè di pagina.

 #template_footer #credito {
    bordo:0;
    colore: #66bae3;
    famiglia di caratteri: Arial;
    dimensione del carattere: 12px;
    altezza della linea: 125%;
    allineamento testo:centro;
    imbottitura: 0 48px 48px 48px;
}

L'esempio sopra mostra come cambiare il colore del testo del piè di pagina. Allo stesso modo:

• Per aggiungere/modificare il testo nell'e-mail di elaborazione, puoi sovrascrivere il modello di e-mail 'customer-processing-order.php' e cambiarlo.
• Se non desideri mostrare l'indirizzo di spedizione per tutti gli ordini, sovrascrivi il modello di email 'email-customer-details.php'.
• Per abbellire il design della tua email, sovrascrivi il modello di email "email-styles.php" e aggiungi il tuo CSS personalizzato.
• Per includere banner di fiducia del tuo marchio come consegna rapida, supporto migliore, pagamento sicuro e così via, sostituisci il modello di email "email-footer.php".

Personalizzazione condizionale con Hooks

Questo approccio alla personalizzazione delle e-mail riguarda il codice personalizzato di WooCommerce. Ovviamente, richiede un alto livello di esperienza in PHP.

Ma il processo è semplice perché i layout WooCommerce originali sono ancora in uso. Il processo prevede la modifica di parti del contenuto.

Ad esempio, vuoi aggiungere il metodo di spedizione scelto, nell'e-mail dell'ordine.
Puoi usare woocommerce_email_after_order_table o woocommerce_email_before_order_table per aggiungere il contenuto.

 add_action( 'woocommerce_email_after_order_table', 'sa_add_shipping_method_
to_order_email', 10, 2 );
funzione sa_add_shipping_method_to_order_email ($ ordine, $ is_admin_email ) {
    echo 'Spedizione: ' . $ordine->get_shipping_method();
}

Ricorda, questi metodi sono strettamente collegati al tema che scegli. Quindi, quando cambi il tema, dovrai spostare anche i file del modello modificati o le azioni aggiunte nel nuovo tema.

Ora passiamo al modo più semplice.

Personalizza i modelli di e-mail utilizzando i plug-in di personalizzazione delle e-mail di WooCommerce

Perché non provi qualcosa di nuovo che susciti gli interessi dei tuoi clienti? Invia email personalizzate per farli sorridere e sentirsi bene. Ancora di più quando sono disponibili in qualsiasi momento.

Sul mercato al giorno d'oggi, ci sono una miriade di plugin. Per l'anno 2022, abbiamo prodotto un elenco di sei popolari plugin di personalizzazione della posta elettronica WooCommerce.

Vediamo ciascuno di loro con le loro caratteristiche e prezzi.

Email Customizer Pro per WooCommerce

In un mondo in cui i tuoi clienti sono continuamente aggrediti dai contenuti, il componente più costoso è la "portata di attenzione" e se riesci a catturarla, stai inviando delle email meravigliose. Questo è ciò con cui il plugin Email Customizer Pro per WooCommerce può aiutarti.

Il plug-in ti consente di personalizzare facilmente tutti gli undici modelli di e-mail di WooCommerce/e-mail di ordine WooCommerce transazionali predefiniti senza scrivere una riga di codice . Questo plugin è sviluppato da StoreApps, lo sviluppatore ufficiale di estensioni WooCommerce.

Puoi modificare il testo dell'e-mail , i colori, l'intestazione e il piè di pagina, aggiungere collegamenti personalizzati, aggiungere collegamenti ai tuoi social network; il tutto utilizzando la familiare interfaccia di personalizzazione di WordPress .

Le e-mail degli abbonamenti WooCommerce possono anche essere personalizzate.

Un modello di email già pronto dal plugin Email Customizer Pro per WooCommerce è simile al seguente:

Prova la demo dal vivo

Mette in risalto:

• Ottieni cinque modelli già pronti tra cui scegliere. Non ci sono grattacapi di progettazione. Quando scegli un modello, verrai indirizzato al tuo familiare personalizzatore di WordPress, dove potrai apportare modifiche all'e-mail.
• Apporta modifiche al testo del corpo dell'email . Questo è il plugin USP. Puoi modificare le informazioni esistenti e aggiungerne di tue. È possibile modificare tutti i messaggi di ordine e-mail, le intestazioni, i sottotitoli e i commenti di chiusura predefiniti. Includi foto, link a video, coupon e link a post di blog. Potresti anche chiedere feedback e recensioni.
• Un'altra area in cui il plugin brilla è la sezione dei consigli sui prodotti . Per aumentare le vendite tramite upsell e cross-sell, utilizza i tag di unione per mostrare prodotti simili immediatamente all'interno delle e-mail.
• Lo stile dell'intestazione, che include il colore dell'intestazione, il colore del testo dell'intestazione e il testo dell'intestazione, può quindi essere personalizzato. Nello spazio dell'intestazione, puoi inserire un logo per la tua azienda.
• La barra dei menu, invece, permette di visualizzare fino a cinque link personalizzati. Utilizzare questi collegamenti per inviare i clienti a qualsiasi pagina dell'offerta, documentazione del prodotto, pagine del piano di abbonamento speciale e così via.
• Puoi aggiungere del testo alla parte del piè di pagina delle tue e-mail per il piè di pagina. Potrebbe essere un messaggio personalizzato o HTML. Puoi includere tre icone dei social media con collegamenti ai profili dei tuoi marchi. Le icone più comunemente utilizzate nelle e-mail sembrano essere Facebook, YouTube e Instagram.
• È inoltre possibile modificare il colore dello sfondo dell'e-mail, inclusi il colore di sfondo, il colore del bordo dell'e-mail e il colore del corpo dell'e-mail.
• Puoi vedere come appariranno le tue email su diversi dispositivi in ​​tempo reale.
• Invia email di prova ai clienti per vedere come appariranno nelle loro caselle di posta. Verificare che tutto funzioni correttamente e che nulla si sia rotto.

Siete tutti a posto e ritagliatevi la vostra identità di marca unica.

Prezzo: $ 79

Ottieni il plug-in Email Customizer Pro

Personalizzatore e-mail WooCommerce

Sviluppato dal team di WooCommerce, il plug-in WooCommerce Email Customizer ha il WordPress Customizer integrato che ti consente di modificare visivamente il design del tuo modello di email. Non hai bisogno di alcuna conoscenza di programmazione.

Ma ricorda, questo plugin personalizza solo il design delle tue e-mail e non il testo o il contenuto delle e-mail.

Prezzo: $ 79

Ottieni il plug-in WooCommerce Email Customizer

Personalizzatore e-mail per WooCommerce di ThemeHigh

Questo è anche un popolare plug-in di personalizzazione della posta elettronica di WooCommerce. C'è una versione gratuita del plugin su WordPress.org e una versione premium.

Mette in risalto:

• Guarda l'anteprima dal vivo delle modifiche
• Aggiungi righe illimitate al modello di email
• Aggiungi diversi elementi email (Base, Woocommerce e hook)
• Invia email di prova

Prezzo: $ 39

Ottieni questo plugin per la personalizzazione della posta elettronica

Designer di posta elettronica visiva per WooCommerce

Un altro plug-in di personalizzazione della posta elettronica WooCommerce con funzionalità di trascinamento della selezione. Ha una versione gratuita su WordPress.org e una versione premium.

Mette in risalto:

• Invia e-mail basate sul prodotto e sulla categoria.
• Incorpora la firma digitale in ogni e-mail di ordine WooCommerce.
• Invia e-mail di prova per dare un'occhiata a come le e-mail sono state consegnate alla casella di posta del cliente.
• Crea le tue linee tematiche.

Prezzo: $ 99

Ottieni il plug-in Visual Email Designer

WooMail - Personalizzatore di posta elettronica WooCommerce

WooMail è un popolare plugin di personalizzazione della posta elettronica su CodeCanyon.

Mette in risalto:

• Modelli e blocchi predefiniti
• Trascina e rilascia, nessuna codifica richiesta.
• Anteprima dal vivo
• Invia email di prova

Prezzo: $ 39

Ottieni il plugin WooMail

YITH Modelli e-mail WooCommerce

Il plug-in YITH WooCommerce Email Templates ti fornisce modelli per dare un aspetto più professionale ai messaggi.

Mette in risalto:

• Aggiungi loghi e link personalizzati
• Cambia colori e tipografia
• Aggiungi collegamenti ai social media
• Elimina l'immagine del prodotto dal contenuto dell'e-mail

Ma non è disponibile alcuna anteprima dal vivo.

Prezzo: $ 80

Ottieni il plugin YITH WooCommerce Email Templates

Vantaggi dell'utilizzo di e-mail WooCommerce personalizzate

Oltre a tutto il resto, è semplicissimo. Poiché i modelli sono predefiniti, i proprietari dei negozi non devono preoccuparsi di inventare un modello ogni volta che si verifica una transazione.

• Design dell'e-mail visivamente attraente ed estetico
• Personalizzato e su misura
• Lo scopo di rendere l'e-mail interattiva
• Le e-mail allettanti rafforzano gli affari, in genere i ricavi delle vendite
• Maggiore coinvolgimento dei clienti
• Metti fine alle e-mail noiose
• Dinamico e prontamente disponibile

La parte migliore delle e-mail WooCommerce personalizzate deve essere il loro design reattivo che semplifica la vita dei proprietari di negozi e degli esperti di marketing.

Il plug-in di personalizzazione dell'e-mail WooCommerce consigliato è...

Per riassumere, Email Customizer Pro per WooCommerce si distingue in modo diverso dagli altri. È un pacchetto completo che include capacità adattabili e di alta qualità.

Il primo sguardo genera vibrazioni positive nel cliente . Incredibilmente progettato e personalizzabile in modo creativo, il plug-in è un must per gli utenti di WooCommerce.

Aggiungerà un tocco di spezie alla tua email. I tuoi clienti hanno la libertà di spazio per sentire il marchio e associarsi a te. Con pochi clic, puoi ricevere e-mail fantastiche che portano in cambio risultati stravaganti.

Ottieni il plug-in Email Customizer Pro

Inizia oggi stesso a personalizzare le tue email

Permettimi di fornirti questo consiglio cruciale. L'e-mail, secondo me, è simile a una lettera d'amore. Puoi anche assumere qualcuno per progettare la newsletter per te o scegliere uno dei servizi di progettazione illimitati che lavori per te.

Dobbiamo consentire ai nostri clienti di sentire il marchio, percepirlo nel modo in cui desideriamo che lo facciano e adottare la nostra immagine del marchio, permettendogli di penetrare nei loro pensieri ed essere lì indefinitamente.

E, secondo me, fare affari significa mantenere una relazione a lungo termine con il cliente.