Blocco Product add-on

Il blocco Product add-on offre un singolo prodotto specifico che scegli tu come componente aggiuntivo dentro il carrello, promuovendo un prodotto noto (una garanzia, un campione, un best-seller) come aggiunta rapida direttamente nel carrello.

• Se non si risolve nessuna variante attiva — il prodotto non è impostato, è archiviato o è esaurito — il blocco non renderizza nulla invece di un pulsante inutilizzabile.
• Il controllo riflette se la riga add-on di questo specifico blocco è nel carrello, quindi disattivarlo rimuove la riga che aveva aggiunto (e non influisce sullo stesso prodotto aggiunto altrove).
• Un prezzo compare-at viene barrato quando c’è un ribasso reale; l’etichetta ”% off” è nascosta se lo sconto arrotonda sotto l’1%.
• L’immagine dell’add-on ricade sull’immagine in evidenza del prodotto quando la variante scelta non ne ha una.

Title, Price label e Description supportano tutti gli stessi quattro token: {{product_title}}, {{price}}, {{compare_at_price}} e {{savings}}.

• Regione: body o bottom.
• Massimo: 3 per stato del carrello — il carrello pieno e il carrello vuoto hanno ciascuno la propria quota.
• Stato: sia carrello pieno che vuoto.
• Non aggiunto per impostazione predefinita. Non bloccato — puoi rimuoverlo o nasconderlo.

Supporta un template personalizzato dalla sua scheda Code, che sostituisce il markup integrato di questo blocco con il tuo JSX. Queste sono le props che riceve. 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. La sezione Text in Design ti consente di controllare la tipografia di tre elementi. Usa il selettore Text element per passare da uno all’altro. Title — il nome del prodotto. 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. Price — la riga del prezzo. Il grassetto e il colore del testo si impostano nel Rich Text Editor sopra. Description — il testo di supporto. Il grassetto e il colore del testo si impostano nel Rich Text Editor sopra. Cosa sono le impostazioni di design? Scopri di più qui: Impostazioni di design.