Blocchi e sotto-blocchi
- 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
- Cart items
- Checkout button
Blocchi predefiniti
- 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
Content, Design e Code
- 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
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
- 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.
- 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.
- Discount code: un campo per applicare un codice sconto.
- Notes: un campo per le note dell’ordine.
- 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.
- Template personalizzati: sostituisci il rendering di qualsiasi blocco dalla sua scheda Code.
Blocchi disponibili in ogni sezione
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
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.