Vuoi riorganizzare la tua pagina di checkout senza scrivere codice? Easy Digital Downloads costruisce la pagina di checkout da singoli blocchi interni: il carrello, le informazioni personali del cliente, i dettagli di pagamento e un campo per il codice sconto. Ogni blocco ha le proprie impostazioni e l'intero layout può essere ricostruito direttamente dall'editor a blocchi di WordPress.
Questa guida ti accompagna attraverso i passaggi per scegliere un layout di checkout, riorganizzare i suoi blocchi e configurare le impostazioni di ciascun blocco.
- Apertura del pannello Layout del Blocco Checkout
- Scelta di un Layout
- Riorganizzazione dei Blocchi di Checkout
- Configurazione delle Impostazioni del Blocco Carrello
- Configurazione delle Impostazioni del Blocco Informazioni Personali
- Applicazione di Stile a una Colonna
- Test della Pagina di Checkout
- Risoluzione dei problemi
- Domande frequenti
Apertura del Pannello Layout del Blocco Checkout
Dalla barra laterale di amministrazione di WordPress, vai su Pagine e apri la tua pagina di checkout. Non sei sicuro di quale pagina si tratti? Dalla barra laterale di amministrazione di WordPress, vai su Download » Impostazioni » Pagamenti per trovare la pagina impostata nel campo Pagina di Checkout.
Una volta aperta la pagina nell'editor a blocchi, seleziona il blocco EDD Checkout per vedere le opzioni di impostazione del Layout.
Dai un'occhiata all'elenco completo dei blocchi EDD.
Scelta di un Layout
Cinque layout sono disponibili dal pannello Layout:
- Colonna singola: impila il carrello, le informazioni personali, le informazioni di pagamento e il modulo sconto in un'unica colonna. Scegli questa opzione per un checkout semplice e lineare.
- Due colonne: 50/50: divide il checkout in modo uniforme. Scegli questa opzione quando il carrello e il modulo necessitano di un peso visivo uguale.
- Due colonne: 70/30: dà più spazio al lato del modulo. Scegli questa opzione quando i campi delle informazioni personali e di pagamento necessitano di più spazio.
- Due colonne: 80/20: dà ancora più spazio al lato del modulo, con il carrello come una stretta colonna di riepilogo.
- Carrello in alto, modulo a due colonne: posiziona il carrello in alto, con le informazioni personali e di pagamento in due colonne sottostanti.
Nota: Il passaggio a un layout diverso sostituisce ogni blocco già presente all'interno del blocco di checkout. Scegli un layout prima di personalizzare i singoli blocchi, poiché il passaggio successivo annulla tale personalizzazione.
Riorganizzazione dei Blocchi di Checkout
Una volta scelto un layout, ogni sezione del checkout, il carrello, le informazioni personali, le informazioni di pagamento e il modulo sconto, diventa un blocco a sé stante. La selezione di qualsiasi blocco rivela la sua barra degli strumenti con opzioni per spostarlo, duplicarlo o eliminarlo.
Per spostare un blocco, selezionalo, quindi utilizza i controlli di spostamento della barra degli strumenti per trascinarlo in una nuova posizione o per spostarlo su, giù, a sinistra o a destra a seconda del layout corrente.
Un blocco può anche essere rimosso completamente selezionandolo e scegliendo elimina dalla sua barra degli strumenti. Ciò è diverso dal disattivare il modulo sconto, che utilizza un'impostazione invece di rimuovere un blocco. Vedi Risoluzione dei problemi di seguito.
Configurazione delle impostazioni del blocco carrello
La selezione del blocco carrello apre le sue impostazioni nella barra laterale:
- Mostra riga di intestazione mostra le intestazioni di colonna "Nome articolo" e "Prezzo articolo" sopra il contenuto del carrello. Questa opzione è attiva per impostazione predefinita.
- Mostra miniature mostra una miniatura del prodotto accanto a ogni articolo del carrello. Questa opzione è attiva per impostazione predefinita, con un campo Larghezza miniatura (25px per impostazione predefinita) per regolare le dimensioni.
- Mostra controlli quantità consente ai clienti di modificare la quantità di un articolo che stanno acquistando direttamente dal checkout. Questa opzione è attiva per impostazione predefinita.
- Mostra modulo sconto mostra il campo del codice sconto come parte del carrello. Questa opzione è attiva per impostazione predefinita. Disattivarla nasconde il campo sconto senza rimuovere il blocco carrello stesso.
Configurazione delle impostazioni del blocco informazioni personali
La selezione del blocco informazioni personali apre un'impostazione: Combina nome e cognome. Attivandola si uniscono i due campi nome in un unico campo, il che può rendere il modulo di checkout più corto. Questa opzione è disattivata per impostazione predefinita.
Applicazione di Stile a una Colonna
La scelta di un layout a due colonne trasforma ogni colonna in un blocco a sé stante con una scheda Stili, separata dalle impostazioni dei blocchi di checkout. Dalla scheda Stili, a una colonna può essere assegnato un predefinito di stile integrato, oppure un colore di sfondo personalizzato, un gradiente, un riempimento e angoli arrotondati.
Test della Pagina di Checkout
Prima di pubblicare qualsiasi modifica al layout, l'interruttore Anteprima come ospite del blocco checkout, che si trova nella barra laterale del blocco padre EDD Checkout (non in quella del blocco carrello), mostra esattamente ciò che vede un cliente. La ricerca Seleziona un download nella barra laterale può anche visualizzare in anteprima il checkout con un prodotto specifico già nel carrello.
Testare in questo modo, o completare un acquisto di prova reale, conferma che il layout sia corretto prima che vada online.
Risoluzione dei problemi
Il campo del codice sconto è stato rimosso e non tornerà dall'inseritore di blocchi.
Il campo del codice sconto non è un blocco separato che può essere reinserito. È invece un'impostazione sul blocco carrello. Per riattivarlo, seleziona il blocco carrello, apri le sue impostazioni e riattiva Mostra modulo sconto.
Fatto! La pagina di checkout può ora essere riorganizzata, personalizzata e stilizzata interamente dall'editor a blocchi di WordPress. Per un approccio di progettazione più avanzato, con il trascinamento, consulta Personalizzazione del tuo checkout EDD con Elementor.
Domande frequenti
Di seguito sono riportate le risposte ad alcune delle domande più comuni sulla personalizzazione del layout della pagina di checkout utilizzando i blocchi interni di EDD.
Devo rifare la mia pagina di checkout dopo aver aggiornato Easy Digital Downloads?
No, non finché la pagina non viene aperta e salvata. Una volta salvata, la pagina di checkout si aggiorna automaticamente alla nuova struttura a blocchi e le impostazioni già scelte, come il layout o la visualizzazione del modulo sconto, vengono mantenute.
Ho bisogno di un piano specifico per personalizzare il layout della mia pagina di checkout?
No. I blocchi di checkout EDD e le loro opzioni di layout sono disponibili per ogni utente. Se volessi importare un design dalla libreria Modelli di checkout EDD, avresti bisogno di una licenza Pro attiva.
Cosa posso personalizzare nella mia pagina di checkout?
Il carrello, i campi delle informazioni personali, i dettagli di pagamento e il campo del codice sconto possono essere riorganizzati, rimossi o modificati. Ognuno è un blocco a sé. Blocchi standard di WordPress, come un paragrafo, un titolo o una citazione di testimonianza, possono essere inseriti insieme a questi.
Cambiare il layout del mio checkout danneggerà qualcosa?
No. Ogni layout di checkout disponibile è un design funzionante e riorganizzare i blocchi interni utilizza gli stessi strumenti usati per modificare qualsiasi altra pagina in WordPress.
Posso ancora usare Elementor per progettare la mia pagina di checkout?
Sì. Per un controllo di progettazione più avanzato, personalizzare il tuo checkout EDD con Elementor funziona. Questi blocchi sono per chiunque desideri un modo più semplice e integrato per personalizzare il layout senza un plugin page builder.
I blocchi di checkout EDD funzioneranno con il mio tema WordPress?
Nella maggior parte dei casi, sì. Poiché si tratta di blocchi standard di WordPress, funzionano con la maggior parte dei temi. Se un tema ha uno stile personalizzato insolito, controlla come appare la pagina di checkout prima di pubblicare le modifiche.
