Panoramica

Questa personalizzazione impedisce che vengano aggiunti più upsell contemporaneamente nascondendo la sezione upsell non appena un upsell viene accettato. Una volta che l’upsell viene rimosso, il modulo riappare. È utile se vuoi:

Semplificare l’esperienza del carrello
Ridurre la fatica decisionale
Mantenere un senso di esclusività attorno a determinate offerte

Come funziona

Quando un cliente accetta un upsell, la sezione upsell viene nascosta
Se l’articolo upsell viene rimosso, la sezione upsell torna visibile
Funziona sia con gli upsell consigliati dall’AI sia con quelli manuali

Dove aggiungere il codice

Vai su Upcart > Cart Editor > Settings > Custom HTML

Il selettore qui sotto è solo per la Versione 1. .upcart-upsells-module si trova sul carosello upsell V1. Se il tuo modulo Upsells è sulla Versione 2, sostituiscilo con .upcart-public-upsell in tutti e tre gli handler — il resto dello script rimane invariato. Consulta la libreria dei selettori CSS V2.

Incolla il codice seguente nella posizione Above announcements/rewards

Script HTML da copiare

<script>  
  // Show upsells again when upsells are removed  
  window.upcartSubscribeItemRemoved((event) => {  
    if (event.item?.properties?.__upcartUpsell) {  
      const upsells = window.upcartDocumentOrShadowRoot.querySelector(".upcart-upsells-module");  
      if (upsells) upsells.style.display = "block";  
    }  
  });  
  
  // Hide upsells once one is added  
  window.upcartSubscribeUpsellsAddedToCart(() => {  
    const upsells = window.upcartDocumentOrShadowRoot.querySelector(".upcart-upsells-module");  
    if (upsells) upsells.style.display = "none";  
  });  
  
  // Check for upsell in cart when it loads  
  window.upcartSubscribeCartLoaded((event) => {  
    const upsells = window.upcartDocumentOrShadowRoot.querySelector(".upcart-upsells-module");  
    const items = event.cart.items || [];  
    const hasUpsell = items.some(item => item?.properties?.__upcartUpsell);  
    if (upsells && hasUpsell) {  
      upsells.style.display = "none";  
    }  
  });  
</script>

Nota legacy: i callback window.upcartOnItemRemoved, window.upcartOnAddUpsell e window.upcartOnCartLoaded funzionano ancora ma sono deprecati e generano avvisi nella console. Usa upcartSubscribeItemRemoved, upcartSubscribeUpsellsAddedToCart e upcartSubscribeCartLoaded per tutti i nuovi script.

Risultato

Una volta aggiunta questa personalizzazione:

I clienti vedono gli upsell solo se non ne hanno già accettato uno
Il modulo upsell viene nascosto non appena un upsell viene aggiunto
Il modulo riappare automaticamente se l’articolo upsell viene rimosso
Non serve configurare ID prodotto o tag

Questo mantiene la tua esperienza di upsell focalizzata, ordinata e facile da usare per i clienti.

Hai ancora bisogno di aiuto?

Per personalizzazioni più avanzate, ti consigliamo di lavorare con uno Shopify Expert. Può aiutarti con HTML, CSS e JavaScript all’interno del tuo cart drawer. Vedi gli Shopify Experts

Per iniziare

Moduli del carrello

Impostazioni del carrello

Pulsante carrello fisso

Multicart

Personalizzazioni

Analisi

Integrazioni e compatibilità

Fatturazione e account

Risoluzione dei problemi

Limitare il carrello a un solo upsell alla volta

Panoramica

Come funziona

Dove aggiungere il codice

Script HTML da copiare

Risultato

Hai ancora bisogno di aiuto?

​Panoramica

​Come funziona

​Dove aggiungere il codice

​Script HTML da copiare

​Risultato

​Hai ancora bisogno di aiuto?

Panoramica

Come funziona

Dove aggiungere il codice

Script HTML da copiare

Risultato

Hai ancora bisogno di aiuto?