Skip to main content
⚠️ Avviso importante Lo snippet del tema qui sotto si applica a entrambe le versioni dei moduli carrello di Upcart — fa sì che Shopify renderizzi i pulsanti di checkout accelerato sulla pagina, che è ciò di cui Upcart ha bisogno indipendentemente dalla versione del modulo. Il selettore .additional-checkout-buttons qui sotto è la classe di Shopify sul contenitore del checkout accelerato, non una classe di un modulo Upcart, quindi è la stessa su entrambe le versioni del carrello.

Panoramica

A volte i pulsanti di checkout express non sono cliccabili o non appaiono all’interno di Upcart. Si tratta di un problema comune causato da come Shopify controlla il rendering dei pulsanti di pagamento express nei temi. Questa guida spiega perché succede e cosa puoi fare per risolverlo.

Configurazione richiesta per il nuovo modulo

⚠️ Importante: questi passaggi si applicano al nuovo modulo Express Payments di Upcart, non alla versione legacy. Per far funzionare correttamente i pulsanti di checkout express in Upcart, devi aggiungere un piccolo snippet di codice al tuo tema Shopify. Senza questo snippet, Shopify non caricherà correttamente i pulsanti di pagamento all’interno del cart drawer. Prima di apportare queste modifiche, verifica che i metodi di pagamento pertinenti (ad es. Shop Pay, PayPal, Apple Pay, Google Pay) siano abilitati nelle impostazioni del tuo account Shopify Admin. Senza abilitare questi metodi, i pulsanti non saranno visibili. Inoltre, assicurati che lo snippet sia posizionato direttamente sotto il tag di apertura <body> nel file del tuo tema (ad es. <body class="...">). Se posizionato in modo errato, ad esempio dopo il tag di chiusura </body>, i pulsanti di checkout express potrebbero non funzionare correttamente.

Come risolvere

  1. Vai al tuo Shopify Admin.
  2. Vai a Online Store > Themes > Edit Code.
  3. Apri layout/theme.liquid, trova la riga <body> e aggiungi lo snippet qui sotto su una nuova riga direttamente sotto di essa. Deve andare lì — non in cart-drawer.liquid o altrove — perché i pulsanti devono esistere su ogni pagina in cui il carrello può aprirsi.
  1. Salva le modifiche e aggiorna il tuo negozio.
  2. Riapri il cart drawer per verificare che i pulsanti di checkout express (come Shop Pay, PayPal, Apple Pay o Google Pay) ora appaiano e siano cliccabili.
Consulta la guida al modulo Express Payments per le istruzioni complete di configurazione.

Perché succede

I pulsanti di pagamento express sono gestiti interamente da Shopify, non da Upcart. Ciò significa che:
  • Upcart non renderizza i propri pulsanti. Clona i pulsanti di checkout accelerato di Shopify dalla pagina nel cart drawer, motivo per cui devono innanzitutto essere presenti sulla pagina — è ciò che garantisce lo snippet del tema qui sopra.
  • Apple Pay verrà mostrato solo sui dispositivi Apple con Apple Pay configurato.
  • Upcart non controlla quali pulsanti express appaiono, poiché il contenuto e la funzionalità sono gestiti da Shopify.
🎨 Nota:
I pulsanti in Upcart fungono da contenitori visivi, mentre Shopify ne controlla la visualizzazione e il comportamento. Upcart non può modificarne l’aspetto o la funzione.

Problemi comuni e soluzioni

1. I pulsanti non vengono renderizzati sulla pagina

Questa è la causa più comune. Upcart clona i pulsanti di Shopify dalla pagina, quindi se la pagina non li renderizza non c’è nulla da clonare e il carrello mostra uno spazio vuoto. Cosa fare:
  • Aggiungi lo snippet del tema dalla sezione Come risolvere qui sopra, direttamente sotto la riga <body> in layout/theme.liquid.
Non rimuovere i pulsanti express del tuo tema per “evitare un conflitto”. Upcart dipende dalla loro presenza. Rimuoverli dal tema, o disattivarli nelle impostazioni del tema, elimina la fonte da cui Upcart clona — il che peggiora il problema, non lo migliora.

3. Il CSS sta bloccando i pulsanti

Alcuni temi nascondono i pulsanti express per impostazione predefinita usando CSS. Ad esempio:
Cosa fare:
  • Rivedi il CSS del tuo tema.
  • Chiedi al tuo sviluppatore di tema di assicurarsi che nessuna regola CSS stia nascondendo o disabilitando i pulsanti nel drawer di Upcart.

4. Impostazioni legacy interferiscono

Se hai usato la versione precedente del modulo Express Payments, le impostazioni salvate potrebbero entrare in conflitto con la nuova configurazione. Cosa fare:
  • Apri il vecchio modulo Express Payments (se ancora visibile).
  • Deseleziona tutte le opzioni precedenti e salva.
  • Riprova usando il nuovo modulo.

Hai ancora problemi?

Disabilitare lo Shadow DOM in Upcart

In alcuni casi, i pulsanti di pagamento express potrebbero non caricarsi o non aggiornarsi perché lo Shadow DOM è abilitato in Upcart. Cos’è lo Shadow DOM?
Lo Shadow DOM isola Upcart dal resto del codice del tuo negozio per migliorare la stabilità. Tuttavia, in rari casi, questa separazione può impedire ai pulsanti express di Shopify di aggiornarsi correttamente.
Come disabilitare lo Shadow DOM:
  1. Vai a Upcart > Cart Editor > Settings > Cart settings, poi espandi Advanced Settings.
  2. Deseleziona Render Cart in Shadow DOM.
  3. Salva e riprova.
⚠️ Importante:
Testa sempre il tuo carrello dopo aver disattivato lo Shadow DOM, poiché potrebbe influire su come altre app o elementi del tema interagiscono con Upcart.
💡 Nota: disabilitare lo Shadow DOM può risolvere questo problema ma può introdurre conflitti CSS con il tuo tema. Consulta il documento sull’impostazione Shadow DOM per il compromesso completo.

Ti serve altro aiuto?

Se il problema persiste dopo aver completato questi passaggi:
  • Contatta il tuo sviluppatore di tema per rimuovere codice o impostazioni in conflitto.
  • Puoi anche rivolgerti a un esperto Shopify per modifiche avanzate al tema o assistenza con l’integrazione.

Riferimenti

  • Shopify Help – Accelerated Checkouts
  • Shopify Dev Docs – Express Payment Buttons