Skip to main content
Il layout del tuo carrello è una pila di blocchi: elementi configurabili che aggiungi, riordini, personalizzi e stilizzi nel cart editor. I blocchi che includi, e il loro ordine, sono il carrello che gli acquirenti vedono. Per capire come i blocchi si collocano dentro stati e sezioni, consulta Come funzionano i carrelli?.

Blocchi e sotto-blocchi

Esistono due tipi di blocco:
  • I blocchi si trovano direttamente nel carrello, in una delle tre sezioni: Header, Body o Footer. Ogni sezione offre un set diverso di blocchi.
  • I sotto-blocchi si annidano dentro un altro blocco. Oggi solo Cart items ospita sotto-blocchi: la riga Product (la riga dell’articolo stessa), Subscription upgrade e Custom code.

Aggiungere, riordinare e rimuovere blocchi

  • Aggiungi un blocco con il selettore Add block. Un blocco appare in grigio se non può andare dove lo stai aggiungendo, o se hai raggiunto il suo limite (il selettore mostra un badge count/max).
  • Riordina trascinando un blocco all’interno della sua sezione.
  • Rimuovi con l’icona del cestino, tranne i blocchi bloccati (vedi sotto).
  • Mostra/nascondi la maggior parte dei blocchi con l’interruttore a forma di occhio, che nasconde un blocco agli acquirenti senza eliminarlo. Alcuni blocchi strutturali non possono essere nascosti: Cart items, Checkout button e la riga Product.

Blocchi bloccati

Alcuni blocchi possono essere riordinati ma non eliminati, così il comportamento fondamentale del carrello (per esempio il checkout) non può essere rimosso per errore:
  • Cart items
  • Checkout button

Blocchi predefiniti

I nuovi carrelli partono con un layout predefinito funzionante:
  • Carrello pieno: Header, Banner, Cart items, Summary, Checkout button
  • Carrello vuoto: Header, blocco Empty cart
Lo stato di carrello vuoto è l’intero layout vuoto. Il blocco Empty cart è un blocco al suo interno. Consulta Come funzionano i carrelli? per la differenza.

Quanti blocchi di ogni tipo puoi aggiungere

I limiti si contano per stato del carrello, non per carrello. Il carrello pieno e il carrello vuoto hanno ciascuno il proprio limite, quindi un carrello può contenere tre Banner nel layout pieno e altri tre nel layout vuoto. La maggior parte dei blocchi è limitata a uno per stato. Le eccezioni:

Content, Design e Code

Ogni blocco si configura attraverso fino a tre superfici nell’editor:
  • Content: le impostazioni del blocco (testo, scelta dei prodotti, soglie e così via). Il blocco Custom code è l’unica eccezione: non ha un pannello Content perché il blocco è il codice.
  • Design: stile per singolo blocco che si sovrappone alle tue Impostazioni di design globali. Ogni blocco ne ha uno tranne Custom code, che non ha affatto un pannello di impostazioni.
  • Code: sostituisci il rendering integrato del blocco con un template personalizzato. La maggior parte dei blocchi lo supporta; un paio no.

Mostrare o nascondere per mercato, paese o valuta

Alcuni blocchi possono mostrare impostazioni diverse, o nascondersi del tutto, in base a chi è l’acquirente. Questo è distinto dall’interruttore a occhio della barra laterale, che attiva o disattiva un blocco per tutti. Tipi di condizione supportati oggi: mercato Shopify, paese del cliente e valuta del cliente (ciascuno con In o Not in). Il totale del carrello e il contenuto del carrello non sono tipi di condizione. Usa le soglie dei livelli di Rewards per i progressi basati su spesa/quantità, o il Cart SDK quando ti serve una regola che l’editor non può esprimere. Le condizioni sono una lista ordinata: vince la prima condizione corrispondente. Metti le regole specifiche sopra una condizione generica All buyers. Se non c’è corrispondenza, il blocco non renderizza nulla per quell’acquirente. Nell’editor oggi, l’interfaccia completa delle Condizioni è disponibile sul blocco Rewards: set di livelli diversi per mercato, paese o valuta. Gli altri blocchi usano un’unica configurazione “all buyers” oppure non partecipano ancora a questo sistema. L’anteprima dell’editor non valuta l’acquirente reale. Seleziona una condizione nel pannello per visualizzare in anteprima quella variante.

Tutti i blocchi

Struttura
  • Header: titolo, conteggio articoli, logo e controllo di chiusura, fissati in alto.
  • Cart items: gli articoli che i clienti aggiungono al carrello; si ripete per riga.
  • Subscription upgrade: sotto-blocco che propone di convertire una riga in un abbonamento.
  • Summary: totali, risparmi e sconti applicati.
  • Checkout button: la call-to-action principale verso il checkout.
  • Empty cart: il contenuto mostrato quando il carrello è vuoto.
  • Express payments: pulsanti di checkout accelerato (Shop Pay, PayPal e così via) dentro il carrello.
Merchandising
  • Upsells: raccomandazioni di prodotto scelte da una strategia.
  • Product add-on: un singolo prodotto specifico offerto come add-on.
  • Rewards: premi a livelli come spedizione gratuita o omaggi.
  • Shipping protection: un add-on opzionale di protezione della spedizione.
Input dell’acquirente
  • Discount code: un campo per applicare un codice sconto.
  • Notes: un campo per le note dell’ordine.
Contenuto
  • Banner: un banner con un messaggio, con timer per il conto alla rovescia opzionale.
  • Image: una singola immagine o un preset ospitato come le icone di pagamento.
  • Custom code: HTML o React personalizzato ovunque nel carrello.
Estensione

Blocchi disponibili in ogni sezione

Ogni sezione ha un set diverso di blocchi disponibili. Questo mantiene il layout ordinato e riduce il disordine. Alcuni di questi blocchi sono specifici di uno stato (per esempio Empty cart solo nello stato vuoto). Consulta Come funzionano i carrelli?.

Errori di validazione dei blocchi

Se le impostazioni di un blocco contengono un valore non valido, un piccolo puntino rosso appare accanto al nome di quel blocco nella barra laterale. Il puntino rimane finché non risolvi il problema. Non è una notifica che si può chiudere. Finché un blocco ha un errore, il salvataggio è bloccato. Il pulsante Save resta cliccabile, ma selezionandolo appare un toast di errore (“Fix the errors in your cart blocks before saving”) e si salta al primo blocco con un problema, aprendone le impostazioni così puoi correggere il campo evidenziato. Publish richiede inoltre che non ci siano modifiche non salvate, quindi rimane non disponibile finché un salvataggio pulito non riesce. Una volta corretto il campo non valido, il puntino scompare da solo e il salvataggio procede normalmente.
I blocchi nascosti vengono comunque validati. Un blocco che hai nascosto può contenere un’impostazione non valida, mostrare un puntino di errore e bloccare il salvataggio esattamente come uno visibile, quindi se il salvataggio è bloccato e tutti i blocchi visibili sembrano a posto, controlla i blocchi nascosti.