> ## Documentation Index
> Fetch the complete documentation index at: https://docs.aftersell.com/llms.txt
> Use this file to discover all available pages before exploring further.
# Blocco Rewards
> Il blocco Rewards di Aftersell Cart: spedizione gratuita a livelli, sconti e omaggi, inclusi livelli diversi per mercato, paese o valuta.
> Il blocco **Rewards** mostra una barra di avanzamento verso livelli di ricompensa (spedizione gratuita, uno sconto sull'ordine o un omaggio) che gli acquirenti sbloccano aggiungendo altro al carrello, incentivando carrelli più grandi mostrando agli acquirenti quanto sono vicini alla prossima ricompensa e concedendo automaticamente le ricompense raggiunte. I livelli possono variare per mercato, paese e valuta.
## Validazione delle soglie dei livelli
L'elenco dei livelli di ogni condizione contiene fino a **4** livelli — un blocco Rewards con diverse condizioni per mercato, paese o valuta ne memorizza fino a 4 per condizione, e poiché viene mostrata la prima condizione corrispondente, ogni singolo acquirente ne vede al massimo 4. La soglia di ogni livello deve essere strettamente maggiore di quella del livello precedente — le soglie devono essere in ordine crescente. Se la soglia di un livello è uguale o inferiore a quella del livello precedente, appare un errore inline sul campo soglia di quel livello e il pulsante **Save** viene bloccato finché il problema non è risolto. Il livello interessato si espande automaticamente così l'errore è visibile.
Per esempio, se il Livello 1 è impostato a \$100, il Livello 2 deve essere impostato a \$101 o più.
## Comportamento
* L'avanzamento **esclude** dal totale le righe di omaggi, le righe di product add-on, le righe di shipping protection e le carte regalo, così quegli articoli non gonfiano il progresso dell'acquirente verso una ricompensa.
* Il messaggio mostra l'importo o il conteggio rimanente per il livello successivo, oppure il messaggio di completamento una volta raggiunti tutti i livelli.
* **Gli omaggi vengono concessi automaticamente.** Quando un acquirente raggiunge un livello con omaggio, l'omaggio viene aggiunto al carrello; se scende sotto la soglia, l'omaggio viene rimosso. Con le ricompense cumulabili disattivate, viene concesso solo l'omaggio del livello più alto raggiunto.
* **Add back removed free gifts** controlla cosa succede quando un acquirente rimuove manualmente un omaggio concesso automaticamente. Quando è abilitato (il predefinito), l'omaggio viene automaticamente riaggiunto al successivo aggiornamento del carrello. Quando è disabilitato, la rimozione viene rispettata e l'omaggio resta fuori dal carrello per il resto di quella sessione, così gli acquirenti non devono lottare con il carrello per rifiutare un omaggio.
## Impostazioni
| Impostazione | Cosa controlla | Predefinito |
| ------------------------------------------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------- |
| **Rewards calculation** | Se l'avanzamento è misurato per **Cart total (\$)** o **Cart quantity (#)**. | Cart total (\$) |
| **Stack rewards across tiers** | On: applica ogni ricompensa che l'acquirente sblocca, fino al livello più alto raggiunto. Off: applica solo la ricompensa del livello più alto sbloccato. | On |
| **Add back removed free gifts** | Riaggiunge un omaggio guadagnato dopo che l'acquirente lo ha rimosso. | On |
| **Show tier icons** | Se le icone dei livelli appaiono sulla barra. | On |
| **Show tier labels** | Se il testo dell'etichetta appare su ogni marcatore di livello sulla barra. | Off |
| **Text after completing full rewards bar** | Rich text mostrato una volta raggiunti tutti i livelli. | `All rewards unlocked!` |
| **Tiers** | I livelli di ricompensa (vedi sotto). Fino a **4** per condizione; il pannello mostra un contatore `n/4` e disabilita **Add tier** al raggiungimento del limite. | Nessuno |
Ogni **livello** si espande in:
| Impostazione del livello | Cosa controlla | Predefinito |
| ------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | -------------------------------------------- |
| **Reward type** | **Free shipping**, **Order discount** o **Free gift**. Cambiarlo reimposta il titolo del livello e l'etichetta della barra di avanzamento al testo predefinito del nuovo tipo. | Free shipping |
| **Threshold (\$)** / **Threshold (items)** | Il totale del carrello o il conteggio articoli che sblocca il livello. L'etichetta segue **Rewards calculation**. Minimo `1`. | `50` |
| **Discount value type** | Solo sconti sull'ordine: **Percentage (%)** o **Fixed amount (\$)**. | Percentage (%) |
| **Percentage off** / **Amount off** | Solo sconti sull'ordine: l'importo dello sconto. Le percentuali sono limitate a 100. | `10` |
| **Title before achieving tier** | Messaggio rich-text mostrato mentre all'acquirente manca ancora qualcosa per il livello. Supporta il token `{{amount}}`. | `You're {{amount}} away from free shipping!` |
| **Progress bar label** | L'etichetta mostrata sul marcatore del livello. | `Free shipping` |
| **Gift products** | Solo omaggi: il prodotto o i prodotti/varianti concessi, fino a **3** per livello. | Nessuno |
## Posizionamento e limiti
* **Regione:** qualsiasi (top, body o bottom).
* **Massimo:** 1 per stato del carrello — il carrello pieno e il carrello vuoto ne hanno ciascuno uno proprio.
* **Stato:** sia carrello pieno che vuoto.
* Non aggiunto per impostazione predefinita. Non bloccato, quindi puoi rimuoverlo o nasconderlo.
## Ricompense per mercato
Rewards è oggi il blocco con l'interfaccia **Conditions** completa: definisci più insiemi di livelli, ciascuno mirato a un **mercato Shopify**, un **paese del cliente** o una **valuta del cliente** (**In** o **Not in**). All'acquirente viene mostrata la prima condizione corrispondente. Se nessuna corrisponde, il blocco non renderizza nulla per lui.
Ogni condizione è una card nel pannello delle impostazioni (**When** + condizione). Sotto di essa, una sezione **Display** contiene i livelli per quella condizione. Mantieni le regole specifiche sopra una condizione generica **All buyers**. L'ordine è priorità, non una combinazione di ogni corrispondenza.
Non puoi eliminare l'ultima condizione (ne è sempre richiesta almeno una). L'anteprima dell'editor non valuta l'acquirente reale; seleziona una condizione nel pannello per visualizzare in anteprima quella variante.
Per come le condizioni si relazionano al toggle a occhio e agli altri blocchi, vedi [Mostrare o nascondere per mercato, paese o valuta](/it/aftersell/cart/blocks-overview#show-or-hide-by-market-country-or-currency).
## Template personalizzato
Supporta un [template personalizzato](/it/aftersell/cart/custom-templates) dalla sua scheda Code, che sostituisce il markup integrato di questo blocco con il tuo JSX. Queste sono le props che riceve.
| Prop | Tipo | A cosa serve |
| -------------------- | ------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------- |
| `milestones` | `Milestone[]` | I livelli di ricompensa, in ordine. Vedi sotto. |
| `rewardsMessageHtml` | `string` | Il messaggio di avanzamento o completamento come HTML sanificato. |
| `showIcons` | `boolean` | Se il merchant ha abilitato le icone dei livelli. |
| `showTierLabels` | `boolean` | Se il merchant ha abilitato le etichette dei livelli sulla barra. |
| `isLoading` | `boolean` | Sempre `false` qui: il blocco renderizza il suo skeleton integrato durante il caricamento e chiama il tuo template solo quando il carrello è pronto. |
Ogni `Milestone`:
| Campo | Tipo | A cosa serve |
| ----------------- | ---------------------- | ------------------------------------------------------------------------------------------------------------------------------------------ |
| `id` | `string` | Chiave stabile per il livello. Usala come `key` di React. |
| `label` | `string` | L'etichetta del livello, come testo semplice. |
| `icon` | `ReactElement \| null` | Elemento icona pre-renderizzato. `null` quando il livello non ne ha. Renderizzalo direttamente: `{m.icon}`. |
| `isCompleted` | `boolean` | Se il carrello ha raggiunto questo livello. |
| `positionPercent` | `number` | Quanto è pieno **il segmento della barra di questo specifico livello**, da `0` a `100` — non una posizione lungo un'unica barra condivisa. |
```jsx theme={"theme":{"light":"snazzy-light","dark":"github-dark"}}
function Rewards(props) {
return (
{props.milestones.map((milestone) => (
// Each tier gets its own track; positionPercent (0-100) fills that track.
{props.showIcons && milestone.icon ? milestone.icon : null}
{props.showTierLabels && milestone.label !== '' ? milestone.label : null}
))}
);
}
```
`m.icon` è un **elemento pre-renderizzato**, non un URL o il nome di un'icona, quindi renderizzalo direttamente invece di provare a costruire un elemento immagine da esso.
`milestones` non è mai vuoto dentro un template personalizzato. Quando non ci sono livelli da mostrare, il blocco non renderizza nulla e il tuo template non viene chiamato affatto, quindi non ti serve un ramo per lo stato vuoto.
## Design
Personalizza lo stile di questo blocco con la sua sezione **Design** nel pannello delle impostazioni. Si tratta di override per singolo blocco che si sovrappongono al tuo design globale e vi ricadono quando sono vuoti.
### Text
La sezione **Text** in Design ti consente di controllare la tipografia degli elementi di testo delle ricompense. Usa il selettore **Text element** per passare da uno all'altro.
**Message** — il messaggio di avanzamento o completamento. Supporta anche una famiglia di font personalizzata. Il grassetto e il colore del testo si impostano nel Rich Text Editor sopra (nella scheda Settings), non qui.
| Impostazione | Cosa controlla | Predefinito |
| ------------------ | --------------------------------------- | ------------------ |
| **Font** | Famiglia di font per il messaggio. | Ereditato dal tema |
| **Size** | Dimensione del font. | `14px` |
| **Line height** | Moltiplicatore dell'altezza della riga. | `1.43` |
| **Letter spacing** | Spaziatura tra i caratteri. | Normal |
**Tier label** — l'etichetta mostrata su ogni marcatore di livello. Disponibile solo quando **Show tier labels** è attivo.
| Impostazione | Cosa controlla | Predefinito |
| ------------------ | -------------------------------------------------------- | --------------------------- |
| **Text color** | Colore dell'etichetta del livello. | Colore del testo secondario |
| **Size** | Dimensione del font. | `13px` |
| **Weight** | Peso del font — Light, Regular, Medium, Semibold o Bold. | Regular (400) |
| **Line height** | Moltiplicatore dell'altezza della riga. | `1.2` |
| **Letter spacing** | Spaziatura tra i caratteri. | Normal |
Cliccando un elemento di testo direttamente nell'anteprima del carrello lo evidenzi e apri automaticamente i suoi controlli nel pannello.
Cosa sono le impostazioni di design? Scopri di più qui: [Impostazioni di design](/it/aftersell/cart/design-settings).