Articoli su: Widget

Come attivare il widget di abbonamento nel negozio online

Per accedere a questa pagina, vai su Supr Bundles & Subscriptions > Design


Il widget è ciò che i tuoi clienti usano per scegliere un abbonamento o un bundle nelle pagine prodotto. Un solo widget mostra entrambi: le tue opzioni di abbonamento e le tue opzioni bundle. Per attivarlo, fai clic su Attiva widget nella pagina Design e poi su Salva nell'editor del tema. Non c'è nessun codice, codice di incorporamento o snippet da incollare.


Indice



Video dimostrativo


Se preferisci guardare invece di leggere, questo video mostra come si attiva l'incorporamento app nell'editor del tema. È proprio l'opzione che Attiva widget attiva per te.



Istruzioni passo passo


  1. Nel tuo pannello di controllo Shopify, apri Supr Bundles & Subscriptions e vai su Design.
  2. Se il widget non è ancora attivo, vedi il banner I tuoi widget non sono ancora attivi. Fai clic su Attiva widget (nel banner o in cima alla pagina).
  3. Nella finestra che si apre, fai clic su Abilita. L'editor del tema si apre in una nuova scheda con Supr Bundle & Subscriptions attivato in Incorporamenti app.

Pulsante Abilita

  1. Nell'editor del tema, fai clic su Salva in alto a destra. Finché non lo fai, l'editor mostra il promemoria One more step. Se chiudi l'editor senza salvare, il widget resta disattivato.

Pulsante Salva dell'editor del tema

  1. Torna alla scheda dell'app. Vedi Widget abilitato quando l'app ha trovato l'opzione salvata. Se compare Widget non abilitato, fai di nuovo clic su Abilita e questa volta assicurati di fare clic su Salva.


Puoi anche partire da Home: il passaggio della guida di configurazione Widget attivato (oppure Widget di abbonamento attivato / Widget bundle attivato, a seconda di ciò che vendi) ha lo stesso pulsante Attiva widget. Quando il widget è attivo, quel pulsante diventa Personalizza widget e ti porta su Design.


Preferisci farlo a mano? Nel tuo pannello di controllo Shopify vai su Negozio online > Temi, fai clic su Personalizza sul tuo tema live, apri Incorporamenti app (l'icona in fondo alla barra laterale sinistra), attiva Supr Bundle & Subscriptions e fai clic su Salva. Nelle versioni precedenti dell'app questa opzione si chiamava Subscriptions (1.0 themes only).


Dove compare il widget


Non c'è nulla da trascinare. Il widget si posiziona da solo nelle pagine prodotto, subito sopra il pulsante di aggiunta al carrello, e funziona allo stesso modo con ogni tema, compresi i temi più vecchi (vintage). Per metterlo altrove, consulta Scegliere una posizione precisa.


  • Compare su ogni pagina prodotto il cui prodotto fa parte di un'offerta Pubblicata, qualunque sia il modello di prodotto usato.
  • Le tue opzioni bundle stanno subito accanto alle opzioni di abbonamento. Se le opzioni bundle stanno sopra o sotto si imposta in Design > Elementi > Layout della pagina > Bundle in alto.
  • Lo spazio sopra e sotto il widget si imposta in Design > Spaziatura > Attorno al widget.
  • Il widget non ha un proprio pulsante di aggiunta al carrello. Usa quello del tuo tema, quindi la pagina prodotto ha bisogno del blocco Pulsanti di acquisto del tema.


Scegliere una posizione precisa


Ci sono due modi per spostare il widget: l'impostazione Posizionamento nella pagina Design, che si applica a tutte le pagine prodotto insieme (un design salvato ha un proprio Posizionamento, per le offerte che lo usano), oppure il blocco Subscriptions + Bundles, che trascini esattamente dove vuoi.


Con l'impostazione Posizionamento:


  1. Nell'app, vai su Design. La sezione Posizionamento compare quando il widget è attivato (vedi i passaggi sopra).
  2. Scegli una Posizione nella pagina prodotto:
    • Sopra il pulsante aggiungi al carrello (automatico): l'impostazione predefinita.
    • Sotto i pulsanti di acquisto: sotto il pulsante di aggiunta al carrello e i pulsanti di checkout rapido, come Acquista ora.
    • Sopra il selettore della quantità: sopra il campo della quantità. Se il tuo tema mostra la quantità sulla stessa riga del pulsante di aggiunta al carrello, il widget va sopra quella riga.
    • Personalizzato (selettore CSS): in qualsiasi punto della pagina. Digita in Selettore CSS un selettore CSS per un elemento della tua pagina prodotto, ad esempio .product__title, e scegli in Posiziona il widget se il widget va prima o dopo quell'elemento, oppure al suo interno, all'inizio o alla fine.
  3. Fai clic su Salva.


Se la posizione scelta non esiste in una pagina (ad esempio una pagina prodotto senza selettore della quantità, o un selettore che non corrisponde a nulla), il widget torna alla sua posizione automatica sopra il pulsante di aggiunta al carrello, così non scompare mai. L'impostazione si applica a ogni tema su cui attivi il widget.


Non sai quale selettore CSS usare? Contatta l'assistenza con il link alla tua pagina prodotto e la posizione in cui vuoi il widget, e te ne invieremo uno.


Con il blocco: se vuoi il widget in un punto preciso, ad esempio sotto il prezzo o sotto la riga delle recensioni, aggiungi il blocco Subscriptions + Bundles dove lo vuoi:


  1. Vai su Negozio online > Temi e fai clic su Personalizza.
  2. Apri una pagina prodotto con il selettore dei modelli in cima all'editor (ad esempio Prodotti > Prodotto predefinito).
  3. Nella sezione delle informazioni sul prodotto, fai clic su Aggiungi blocco, poi su App, poi su Subscriptions + Bundles.
  4. Trascina il blocco dove vuoi il widget e fai clic su Salva.


Lascia attivo l'incorporamento app. Ovunque nella pagina ci sia un blocco Subscriptions + Bundles, la copia dell'incorporamento si rimuove da sola, quindi in questo modo non ottieni mai due widget.


Un blocco appartiene al modello, non a un singolo prodotto. Spostarlo sposta il widget su tutti i prodotti che usano quel modello. Se i tuoi prodotti usano più di un modello di prodotto, ripeti l'operazione su ogni modello in cui vuoi la nuova posizione. I modelli senza blocco mantengono la posizione automatica sopra il pulsante di aggiunta al carrello.


Mostrare il widget su altre pagine


Puoi vendere anche da una pagina che non è quella del prodotto, come una landing page, una pagina di collezione, la home page o un articolo del blog. Lì compare il widget completo, con le stesse opzioni bundle, opzioni di abbonamento e lo stesso design che hai configurato nella pagina Design.


  1. Nell'editor del tema, apri la pagina che ti interessa.
  2. Aggiungi una sezione che mostra un solo prodotto. La maggior parte dei temi la chiama Prodotto in evidenza.
  3. In quella sezione, fai clic su Aggiungi blocco, poi su App, poi su Subscriptions + Bundles.
  4. Fai clic sul blocco e impostane il Prodotto. Fuori da una pagina prodotto il blocco non può sapere a quale prodotto ti riferisci, quindi devi indicarglielo. Finché non lo fai, l'editor del tema mostra Nothing to show yet: this block has no product selected.
  5. Mantieni il blocco Pulsanti di acquisto della sezione. Il widget usa quel pulsante di aggiunta al carrello.
  6. Fai clic su Salva.


Puoi inserirne più di uno nella stessa pagina. Ognuno mantiene le proprie opzioni e i propri prezzi, e il pulsante di aggiunta al carrello di ogni prodotto porta con sé la scelta fatta dall'acquirente per quel prodotto.


L'incorporamento app da solo mostra il widget solo sulle pagine prodotto. Per qualsiasi altra pagina, usa il blocco come descritto sopra.


Un'altra possibilità per un pulsante, un banner o un'email è un link di abbonamento rapido: Crescita > Link di abbonamento rapido crea un link che porta direttamente al checkout con il prodotto e l'abbonamento già scelti. Consulta Creare inviti all'abbonamento (link di abbonamento rapido).


Popup di aggiunta rapida e visualizzazione rapida


Molti temi hanno un pulsante Aggiunta rapida o Visualizzazione rapida sulle schede prodotto nelle collezioni e nella home page. Se il widget compare lì dipende dal tema:


  • Temi il cui popup carica il modulo prodotto completo (ad esempio Dawn con l'aggiunta rapida standard): il widget e le opzioni bundle compaiono all'interno del popup quando il blocco Subscriptions + Bundles si trova nel tuo modello di prodotto. Aggiungilo come descritto in Scegliere una posizione precisa.
  • Horizon e i temi basati su di esso: per un prodotto con un abbonamento, il pulsante di aggiunta rapida apre la pagina prodotto invece di un popup, e il widget è lì come sempre.
  • Altri temi: se il popup non mostra il widget o lo mostra danneggiato, disattiva l'aggiunta rapida nell'editor del tema (di solito è un'impostazione della sezione della collezione o della griglia prodotti), così gli acquirenti vanno alla pagina prodotto, oppure contatta l'assistenza e controlleremo il tuo tema.


PageFly e altri page builder


Non esiste un ID del widget, uno shortcode o un codice di incorporamento, e incollare codice in un elemento Custom Code o HTML non funziona. Il widget è un blocco app di Shopify, e Shopify permette di aggiungere i blocchi app solo tramite l'editor del tema. I page builder lo supportano con un proprio elemento per i blocchi app.


Su una pagina prodotto di PageFly non devi fare nulla. Con l'incorporamento app attivato (vedi i passaggi sopra), il widget si posiziona da solo sopra il pulsante di aggiunta al carrello, proprio come su una pagina prodotto del tema.


Su una landing page di PageFly:


  1. Nell'editor di PageFly, apri la pagina e trascina l'elemento App blocks (tra gli elementi Shopify) dove vuoi il widget. PageFly consente un solo elemento App blocks per pagina, e richiede un tema Online Store 2.0.
  2. Segui l'indicazione di PageFly per aprire l'editor del tema, poi fai clic su Aggiungi blocco, App, Subscriptions + Bundles.
  3. Fai clic sul blocco e imposta il suo Prodotto sul prodotto a cui è destinata la tua offerta.
  4. Assicurati che la pagina abbia anche il pulsante di aggiunta al carrello di PageFly per quello stesso prodotto, poi salva e pubblica.


La guida di PageFly su questo elemento: How to use the App blocks element.


GemPages, Shogun e altri builder funzionano allo stesso modo: le pagine prodotto ricevono il widget dall'incorporamento app, e le altre pagine hanno bisogno dell'elemento del builder per i blocchi app di Shopify, con Subscriptions + Bundles aggiunto. Se il tuo builder non elenca il blocco, contatta l'assistenza.


Quando la pagina è online, aggiungi il prodotto al carrello con un abbonamento selezionato e verifica che il carrello lo mostri. In caso contrario, inviaci il link della pagina e posizioneremo noi il widget per te.


Configurazione su un tema non pubblicato


Attiva widget apre sempre il tuo tema live (pubblicato). Per configurare e provare prima un altro tema:


  1. Vai su Negozio online > Temi, trova il tema e fai clic su Personalizza (o Modifica tema).
  2. Apri Incorporamenti app, attiva Supr Bundle & Subscriptions e fai clic su Salva.
  3. Visualizza l'anteprima di quel tema e apri un prodotto che fa parte di una delle tue offerte.


Il widget compare solo sui temi in cui è attivato, quindi il tuo tema live resta invariato finché non lo attivi anche lì. Le tue offerte sono condivise da tutti i temi: quando il widget è attivo nel tuo tema live, lì compare ogni offerta Pubblicata.


Risoluzione dei problemi


Se il widget non compare dopo il salvataggio, verifica che l'editor del tema abbia salvato correttamente. Puoi fare di nuovo clic su Attiva widget per riprovare.


Se ancora non vedi il widget nelle pagine prodotto, segui Il widget di abbonamento non viene visualizzato nel mio negozio. Se compare due volte o nel posto sbagliato, consulta Il widget di abbonamento compare due volte o in fondo alla pagina.


Domande frequenti


Devo aggiungere al mio tema un codice di incorporamento o uno snippet Liquid?
No. Design > Attiva widget attiva il widget nel tuo tema, e tu fai clic su Salva nell'editor del tema. Non c'è nulla da incollare.


Ho fatto clic su Attiva widget ma nel mio negozio non è cambiato nulla. Perché?
Quasi sempre l'editor del tema è stato chiuso senza fare clic su Salva. Fai di nuovo clic su Attiva widget e poi su Salva in alto a destra nell'editor del tema.


Mi servono sia l'incorporamento app sia il blocco app?
Ti serve l'incorporamento app. Il blocco Subscriptions + Bundles è facoltativo: aggiungilo solo per scegliere una posizione precisa o per mostrare il widget su una pagina che non è una pagina prodotto. Usarli entrambi non mostra mai il widget due volte.


L'editor del tema dice che non è stato possibile aggiungere il blocco app. Cosa faccio?
Usa invece l'incorporamento app: Design > Attiva widget, poi Salva. L'incorporamento non ha bisogno di un posto nella sezione del prodotto, quindi funziona anche con i temi la cui sezione del prodotto non accetta blocchi app.


Devo aggiungere il widget a ogni prodotto?
No. Il widget compare su ogni prodotto che fa parte di un'offerta Pubblicata. I prodotti si scelgono nell'offerta, in Si applica a, non nel tema.


Posso mostrare il widget sulla home page o su una landing page?
Sì. Aggiungi una sezione Prodotto in evidenza, aggiungici il blocco Subscriptions + Bundles e impostane il Prodotto. Consulta Mostrare il widget su altre pagine.


I clienti possono scegliere un abbonamento nella pagina del carrello?
Sì, con il componente aggiuntivo Upsell nel carrello nella pagina Design: un pulsante Abbonati e risparmia sotto ogni prodotto acquistato singolarmente, nella pagina del carrello e nel carrello laterale, passa quel prodotto alla sua prima opzione di abbonamento. Per scegliere un'altra frequenza, i clienti scelgono nella pagina prodotto. Su Shopify Plus, il Checkout Subscription Picker permette anche di passare all'abbonamento al checkout, consulta Passare a un abbonamento al checkout. Consulta Upsell nel carrello.


Posso mettere invece il widget sotto il pulsante di aggiunta al carrello?
Sì. Nella pagina Design, imposta Posizionamento > Posizione nella pagina prodotto su Sotto i pulsanti di acquisto e fai clic su Salva. Consulta Scegliere una posizione precisa.


Come sposto il widget sopra il pulsante di aggiunta al carrello?
Con l'incorporamento app attivo, è lì che si posiziona da solo. Se si trova altrove, consulta Il widget di abbonamento compare due volte o in fondo alla pagina.


Guide correlate


Aggiornato il: 24/10/2026

È stato utile questo articolo?

Condividi il tuo feedback

Annulla

Grazie!