Blocchi app per il tema
L'estensione tema di Gibbond aggiunge tre elementi allo storefront — un widget carrello, una striscia per il cart drawer e annotazioni di prezzo in base al tier. Nessuno script iniettato: è tutto un app block o app embed Online Store 2.0 che controlli dall'editor del tema.
Cosa ottieni
| Blocco | Tipo | Dove appare |
|---|---|---|
| Cart Loyalty Widget | App block | Nel template della pagina carrello |
| Cart Drawer Loyalty | App embed | Il cart drawer / mini-carrello AJAX del tuo tema |
| Loyalty Price Annotations | App embed | Ogni pagina — annota i prezzi per i membri di un tier |
App block vs app embed. Un app block viene aggiunto a una sezione/template specifico tramite Aggiungi blocco. Un app embed si attiva globalmente dal pannello App embeds (l'icona a forma di puzzle in fondo al pannello sinistro dell'editor del tema).
1 · Cart Loyalty Widget
Una rich card fedeltà nella pagina del carrello. Per i membri che hanno effettuato l'accesso mostra subito il saldo e il badge del tier, una stima dei “punti che guadagnerai” con il dettaglio per articolo, i codici sconto già disponibili con applicazione in un clic e un menu a tendina dei reward da riscattare. I clienti non iscritti vedono un pulsante Iscriviti; gli ospiti vedono un invito ad accedere.
I tuoi reward★ GoldCome aggiungerlo
- Online Store → Temi → Personalizza
Apri il tuo tema nell'editor.
- Passa al template Carrello
Usa il selettore di template in alto per aprire Carrello.
- Aggiungi blocco → App
Nella sezione carrello, clicca Aggiungi blocco e scegli Cart Loyalty Widget.
- Posiziona & configura
Trascinalo dove vuoi, regola le impostazioni qui sotto, poi clicca Salva.
Impostazioni
| Impostazione | Tipo | Default |
|---|---|---|
| Schema colori | select (1–4) | scheme-1 |
| Titolo | text | Your Rewards |
| Colore accento | color | #4c6ef5 |
| Mostra stima punti | checkbox | on |
| Mostra reward & riscatto | checkbox | on |
| Mostra codici sconto esistenti | checkbox | on |
| Testo invito all'accesso | text | Sign in to view your loyalty rewards |
2 · Cart Drawer Loyalty
Una striscia compatta inserita nel cart drawer a scomparsa del tuo tema: saldo + badge del tier + “Guadagna X punti” + un link Riscatta per i membri, un pulsante Iscriviti per chi non è iscritto e un'anteprima di accesso per gli ospiti. Appare quando il drawer si apre e si rimuove da solo quando si chiude.
Come aggiungerlo
- Editor del tema → App embeds
Clicca l'icona a forma di puzzle in fondo al pannello sinistro.
- Attiva “Cart Drawer Loyalty”
Espandilo per impostare le opzioni, poi clicca Salva.
Impostazioni
| Impostazione | Tipo | Default |
|---|---|---|
| Colore accento | color | #4c6ef5 |
| Selettore CSS del cart drawer | text | cart-drawer, .cart-drawer, #CartDrawer, … |
| Posizione del widget | select | Before checkout button |
Il widget non compare nel drawer? Il tuo tema usa un elemento drawer non standard. Aggiorna il Selettore CSS del cart drawer in modo che corrisponda al contenitore del drawer del tuo tema (sono supportati selettori separati da virgola).
3 · Loyalty Price Annotations
Per i membri che hanno effettuato l'accesso il cui tier prevede uno sconto, questo app embed annota i prezzi in tutto lo store — barrando il prezzo originale e mostrando il prezzo del tier come badge o testo inline. Segue il comportamento STACK vs BEST_PRICE del tuo tier e mantiene i prezzi aggiornati anche mentre i clienti navigano e filtrano.
Come aggiungerlo
- Editor del tema → App embeds
Apri il pannello App embeds.
- Attiva “Loyalty Price Annotations”
Imposta il colore del badge, lo stile di visualizzazione e (se necessario) il selettore dei prezzi, poi clicca Salva.
Impostazioni
| Impostazione | Tipo | Default |
|---|---|---|
| Colore del badge | color | #8B5CF6 |
| Selettore CSS dei prezzi (avanzato) | text | .price-item--regular, .price .money, … |
| Stile di visualizzazione | select | Badge / Testo inline |
Le annotazioni vengono mostrate solo ai clienti che hanno effettuato l'accesso e che appartengono a un tier con uno sconto maggiore di zero. Gli ospiti e i clienti del tier base non vedono nulla.
Tutte le stringhe dello storefront sono traducibili e arrivano già con molte lingue (inglese, tedesco, francese, italiano, spagnolo, portoghese, danese, finlandese, norvegese, svedese, polacco). Il testo rivolto ai clienti si localizza automaticamente in base alla lingua dello storefront.