La conferma d’ordine è la pagina peggiore del tuo negozio

Qualcuno ha appena comprato nel tuo negozio. Ha visto una home curata, schede con belle foto e un carrello che funziona. Trenta secondi dopo riceve l’email di conferma, la apre sul telefono e trova una tabella grigia con cinque colonne strette e una riga in fondo che dice «powered by PrestaShop».

Quell’email è la pagina del tuo negozio che più gente apre. Una conferma d’ordine si apre quasi sempre, e spesso due volte: quando arriva e quando arriva il corriere. Nessuna pagina del tuo sito ha quella percentuale. Ed è l’unica che ha ancora l’aspetto del giorno in cui hai installato PrestaShop.

Perché escono così

Il tuo negozio manda tante email diverse: la conferma, l’account creato, la password, la spedizione, il reso, l’avviso al magazzino, più quelle che aggiunge ogni modulo che installi. Quante esattamente dipende da cosa hai installato, ma sono parecchie più di quante si creda. Ognuna è un file HTML dentro la cartella mails, uno per lingua, scritto più di dieci anni fa con tabelle e tag <font>.

Cambiare il tema del negozio non le tocca. Cambiare i colori del tema nemmeno. Sono file a parte, e vivono fuori da tutto quello che hai personalizzato.

Un dettaglio peggiora le cose: ogni aggiornamento di PrestaShop li sostituisce. Se qualcuno li ha modificati a mano nel 2022, quel lavoro è sparito al passaggio di versione successivo senza che nessuno se ne accorgesse, e il negozio è tornato a mandare l’email di fabbrica.

La tabella che nessuno riesce a leggere sul telefono

Il problema più caro sta nell’email più importante. L’elenco prodotti della conferma è una tabella a cinque colonne: riferimento, prodotto, prezzo unitario, quantità e totale.

Su un computer si legge. Su un telefono da 360 pixel, le quattro colonne di numeri se ne prendono circa duecentocinquanta, e al nome del prodotto ne restano ottanta. «Maglietta tecnica a maniche lunghe» si spezza in cinque righe da due parole, oppure l’email intera esce dallo schermo e va trascinata di lato.

Compra qualcosa nel tuo negozio e apri la conferma sul telefono. È la prova più rapida, e la più scomoda.

E c’è una seconda cosa che salta all’occhio quando ci fai caso: il blocco dei totali mostra sempre le sue cinque righe, anche quando non c’è nulla da dire. Un ordine senza sconto mostra «Sconti 0,00 €». Un catalogo con IVA inclusa mostra «Tasse 0,00 €». E una spedizione gratuita —che è un argomento di vendita— compare come «Spedizione 0,00 €» invece di dire «Gratis».

L’altro problema: rimandare la conferma

Succede in tutti i negozi. Il cliente scrive dicendo che l’email dell’ordine non gli è mai arrivata, o che l’ha cancellata per sbaglio, o che ha sbagliato a scrivere il proprio indirizzo. Apri l’ordine nel back office per rimandargliela… e non c’è nessun pulsante che lo faccia.

Per le email di stato c’è. Nello storico degli stati di ogni ordine, ogni riga ha la sua icona di rinvio: «Pagamento accettato», «In preparazione», «Spedito». Funziona perché un cambio di stato resta salvato come riga, e quella riga si può riusare.

La conferma d’ordine non è un cambio di stato. PrestaShop la manda una volta sola, da dentro il processo che convalida l’ordine, e non conserva né la riga né le variabili con cui l’ha composta. L’informazione c’è ancora —i prodotti, gli importi, gli indirizzi, il corriere— ma l’email va rifatta da capo per poter ripartire.

Quello che si fa nel frattempo ha un costo: incollare i dati in un’email scritta a mano, che arriva senza il design del negozio e con il rischio concreto di sbagliare un importo; oppure cambiare lo stato dell’ordine per provocare un invio, che sporca lo storico e recapita al cliente un’email che non aveva chiesto.

E conviene sapere che cosa si rimanda esattamente, perché non è una copia salvata della prima email: il modulo la ricompone dall’ordine così com’è adesso. Se nel frattempo hai corretto l’indirizzo, tolto una riga o è cambiato il corriere, l’email che arriva porta quei dati, non quelli del giorno dell’acquisto. L’unica cosa che non cambia è la data dell’ordine. Per il caso normale —«non mi è arrivata»— è esattamente quello che vuoi: che riceva l’informazione buona, non quella vecchia.

I tre modi per sistemarla

1. Il tema email del back office

Dalla versione 1.7.6 PrestaShop include un generatore di temi email. Ne scegli uno, premi «Genera» e riscrive i file di mails con un altro design.

È la via più rapida e ha due limiti da conoscere prima di iniziare. Il primo è che continua a scrivere file: un aggiornamento di PrestaShop può sovrascriverli di nuovo e bisogna rigenerare. Il secondo è che i temi disponibili sono pochi e lo spazio per il tuo marchio è stretto: cambi il logo e poco altro.

2. Modificare i file a mano

Funziona e dà il controllo totale. È anche un file per email e per lingua: il conto scappa già con due lingue, e si ripete ogni volta che installi un modulo che porta email proprie.

È la strada di chi ha una sola lingua, non teme l’HTML delle email e toccherà tre o quattro modelli, non tutti.

3. Intervenire al momento dell’invio

PrestaShop avvisa con alcuni hook subito prima di spedire ogni email. Lì si può cambiare il contenuto al volo, senza toccare un solo file di mails.

Ha un vantaggio che gli altri due non hanno: siccome non si scrive nessun file, non c’è nulla che un aggiornamento possa portarsi via. E siccome il cambio avviene all’invio, arriva anche alle email dei moduli che installerai domani.

Cosa guardare prima di toccare qualcosa

Qualunque strada tu scelga, ci sono cinque cose da controllare nel tuo negozio questo pomeriggio:

1. Apri un’email vera sul telefono. Non l’anteprima del back office: fai un ordine di prova e aprilo sul tuo telefono.
2. Controlla che le tue email escano in HTML. In Parametri avanzati → Email, se è impostato «solo testo», nessun design si vedrà.
3. Controlla se il tuo tema sovrascrive modelli. Se esiste una cartella mails dentro il tuo tema, quei file vincono su quelli di PrestaShop.
4. Conta le tue lingue. È il numero per cui si moltiplica tutto il lavoro.
5. Prova a rimandare una conferma. Apri un ordine della settimana scorsa e cerca il pulsante. Non trovarlo è la risposta.

Come l’abbiamo montato noi

L’editor è ciò che impedisce che sia solo un altro modello: si aggiungono blocchi —titoli, pulsanti, immagini, colonne, la lista dei prodotti—, si clicca dentro l’email per cambiarli e il risultato appare di fianco mentre scrivi. Non è un’anteprima approssimativa: la disegna lo stesso motore che invia l’email, quindi quello che vedi è esattamente ciò che riceve il cliente.

Ce lo siamo chiesto per i nostri negozi e siamo finiti sulla terza via. Il risultato è il Designer di Email per PrestaShop: si aggancia all’invio, non scrive mai in mails e porta le email del tuo negozio già scritte in cinque lingue, così il lavoro è ritoccare e non partire da zero.

L’elenco prodotti viene impaginato di nuovo in una riga per prodotto —foto, nome, combinazione e «2 × 49,99 €» a sinistra, importo a destra—, ed è questo che lo rende leggibile a 320 pixel senza trascinare nulla. E i totali che vengono a zero spariscono, con un’eccezione voluta: la spedizione gratuita lo dice con quella parola.

E nella scheda di ogni ordine c’è un pulsante che rimanda la conferma al cliente, nella lingua dell’ordine e con i suoi dati reali: il modulo rifà le variabili dall’ordine salvato e l’email esce per la stessa strada dell’originale, quindi arriva esattamente come sarebbe arrivata il primo giorno.

Dentro c’è un editor a blocchi con anteprima dal vivo, cinque temi con caratteri diversi e un pulsante che ti manda qualsiasi email nella posta prima di lasciarla attiva. È qui sotto, con quanto costa e cosa fa.