Centro assistenza
/
Integrazioni
/
Shopify
/
Procedure consigliate di Shopify

Come creare i pulsanti e i moduli Back in Stock per i temi gratuiti di Shopify

Tempo di lettura stimato 2 minuti
|
Ultimo aggiornamento: 7 lug 2025, 00:00 EST

Imparerai

Scopra quali sono le modifiche principali da apportare a ciascun tema gratuito di Shopify per assicurarsi rapidamente che il pulsante e il modulo Torna in magazzino corrispondano allo stile del suo tema. Il pulsante e il modulo di Klaviyo "Notify Me When Available" sono altamente configurabili. Può modificare i colori, i caratteri, il testo e altri elementi in base alle sue preferenze di design.

L'installazione di back in stock è supportata solo per alcuni temi gratuiti di Shopify e non per i negozi Shopify che utilizzano temi personalizzati. In questo momento, il supporto di Klaviyo non può assistere nell'implementazione del back in stock per i negozi che utilizzano temi personalizzati. Per verificare quale tema Shopify sta utilizzando il suo negozio, può utilizzare un rilevatore di temi Shopify.

Prima di iniziare

Se non l'hai ancora fatto, leggi la nostra guida su come iniziare con Shopify per le istruzioni sull'integrazione passo passo, prima di continuare con questo articolo.

Per saperne di più in generale sulla funzionalità nuovamente disponibile e su come abilitarla, leggi la nostra guida sull'installazione nuovamente disponibile per Shopify.

Come stilizzare il suo pulsante e il suo modulo

  1. Quando installa il suo snippet, trovi lo snippet di stile per il suo tema gratuito in questo articolo.
  2. Lo snippet predefinito è mostrato di seguito. Aggiorna (o aggiunge) le voci di riga all'interno delle sezioni trigger: {} e modale: {} dello snippet predefinito in base a quanto mostrato nello snippet di stile.
    1. Per esempio, se ha il tema Crave, deve solo aggiungere la seguente riga all'interno della sezione modale: font_family: '"Archivo", serif; '
  3. Apporti qualsiasi altro aggiornamento stilistico desiderato alle voci di linea, come ritiene opportuno.
text 
<script src="https://a.klaviyo.com/media/js/onsite/onsite.js"></script>
<script>
    var klaviyo = klaviyo || [];
    klaviyo.init({
      account: "PUBLIC_API_KEY",
      platform: "shopify"
    });
    klaviyo.enable("backinstock",{ 
    innescare: {
      product_page_text: "Notify Me When Available",
      product_page_class: "button",
      product_page_text_align: "center",
      product_page_margin: "0px",
      replace_anchor: false
    },
    modale: {
     titolo: "{product_name}",
     body_content: "Si registri per ricevere una notifica quando questo articolo tornerà in stock.",
     email_field_label: "Email",
     button_label: "Notificami quando disponibile",
     subscription_success_label: "Sei dentro! Le faremo sapere quando tornerà.",
     footer_content: '',
     stili_aggiuntivi: "@import url('https://fonts.googleapis.com/css2?family=Roboto+wght@400;700&display=swap');",
     drop_background_color: "#000",
     colore_di_sfondo: "#fff",
     colore_testo: "#222",
     colore_testo_bottone: "#fff",
     colore_di_sfondo_del_pulsante: "#439fdb",
     colore_pulsante_chiusura: "#ccc",
     colore_di_sfondo_errore: "#fcd6d7",
     colore_testo_errore: "#C72E2F",
     colore_di_sfondo_successo: "#d3efcd",
     colore_testo_successo: "#1B9500"
    }
  });
</script>

Voglia

text 
trigger: {
 product_page_class: 'button'
},
modale: {
 font_family: '"Archivo", serif;'
}

Alba

text 
trigger: {
 product_page_class: 'button'
},
modale: {
font_family: '"Assistant", sans-serif;' 
}

Studio

text 
trigger: {
 product_page_class: 'button'
},
modale: {
 font_family: '"Electra", serif;' 
}

Colorblock

text 
trigger: {
 product_page_class: 'button'
},
modale: {
 font_family: '"Futura", sans-serif;' }

Senso

text 
trigger: {
 product_page_class: 'button'
},
modale: {
 font_family: '"Harmonia Sans", sans-serif;'
}

Il gusto

text 
trigger: {
 product_page_class: 'button'
},
modale: {
 font_family: '"Anonymous Pro", sans-serif;'
}

Artigianato

text 
trigger: {
 product_page_class: 'button'
},
modale: {
 font_family: '"Quattrocento Sans", sans-serif;'
}

Cavalcare

text 
trigger: {
 product_page_class: 'button'
},
modale: {
 font_family: '"Avenir Next", sans-serif;'
}

Rinfrescare

text 
trigger: {
 product_page_class: 'button'
},
modale: {
 font_family: '"Questrial", sans-serif;'
}

Semplice

Bellezza

text 
modale: {
 font_family: '"PT Serif",serif;'
}

Pop

Osso

text 
trigger: {
 product_page_class: 'btn btn--full'
},
modale: {
 additional_styles: "@import url('https://fonts.googleapis.com/css?family=Raleway');",
 font_family: '"Raleway","HelveticaNeue","Helvetica Neue",sans-serif;'
}

Giocattolo

text 
trigger: {
 product_page_class: 'btn btn--large btn--full'
},
modale: {
 additional_styles: "@import url('https://fonts.googleapis.com/css?family=Open+Sans');",
 font_family: '"Open Sans","HelveticaNeue","Helvetica Neue",sans-serif;'
}

Nero & Bianco

text 
trigger: {
 product_page_class: 'btn btn--large btn--full'
},
modale: {
 additional_styles: "@import url('https://fonts.googleapis.com/css?family=Open+Sans');",
 font_family: '"Open Sans","HelveticaNeue","Helvetica Neue",sans-serif;'
}

Vibrante

text 
trigger: {
 product_page_class: 'btn btn--large btn--full'
},
modale: {
 additional_styles: "@import url('https://fonts.googleapis.com/css?family=Open+Sans');",
 font_family: '"Open Sans","HelveticaNeue","Helvetica Neue",sans-serif;'
}

Avventura

Tavole da snowboard

text 
trigger: {
 product_page_class: 'btn btn--full'
},
modale: {
 additional_styles: "@import url('https://fonts.googleapis.com/css?family=Karla');",
 font_family: '"Karla","HelveticaNeue","Helvetica Neue",sans-serif;'
}

All'aperto

text 
trigger: {
 product_page_class: 'btn btn--full'
},
modale: {
 additional_styles: "@import url('https://fonts.googleapis.com/css?family=Roboto');",
 font_family: '"Roboto","HelveticaNeue","Helvetica Neue",sans-serif;'
}

Boxe

text 
trigger: {
 product_page_class: 'btn btn--full'
},
modale: {
 additional_styles: "@import url('https://fonts.googleapis.com/css?family=Source+Sans+Pro');",
 font_family: '"Source Sans Pro","HelveticaNeue","Helvetica Neue",sans-serif;'
}

Debutto

Predefinito

text 
trigger: {
 product_page_class: 'btn btn--full'
},
modale: {
 additional_styles: "@import url('https://fonts.googleapis.com/css?family=Work+Sans');",
 font_family: '"Work Sans","HelveticaNeue","Helvetica Neue",sans-serif;'
}

Luce

text 
trigger: {
 product_page_class: 'btn btn--full'
},
modale: {
 additional_styles: "@import url('https://fonts.googleapis.com/css?family=Muli');",
 font_family: '"Muli","HelveticaNeue","Helvetica Neue",sans-serif;'
}

Fornitura

Luce

text 
trigger: {
 product_page_class: 'btn btn--full'
},
modale: {
 additional_styles: "@import url('https://fonts.googleapis.com/css?family=Roboto');",
 font_family: '"Roboto","HelveticaNeue","Helvetica Neue",sans-serif;'
}

Blu

text 
trigger: {
 product_page_class: 'btn btn--large btn--full'
},
modale: {
 additional_styles: "@import url('https://fonts.googleapis.com/css?family=Montserrat');",
 font_family: '"Montserrat","HelveticaNeue","Helvetica Neue",sans-serif;'
}

Narrativo

Caldo

text 
trigger: {
 product_page_class: 'btn btn--full'
},
modale: {
 additional_styles: "@import url('https://fonts.googleapis.com/css?family=Avenir');",
 font_family: '"Avenir","HelveticaNeue","Helvetica Neue",sans-serif;'
}

Luce

text 
trigger: {
 product_page_class: 'btn btn--full'
},
modale: {
 additional_styles: "@import url('https://fonts.googleapis.com/css?family=Open+Sans');",
 font_family: '"Open Sans","HelveticaNeue","Helvetica Neue",sans-serif;'
}

Freddo

text 
trigger: {
 product_page_class: 'btn btn--full'
},
modale: {
 additional_styles: "@import url('https://fonts.googleapis.com/css?family=Lato');",
 font_family: '"Lato","HelveticaNeue","Helvetica Neue",sans-serif;'
}

Brooklyn

Classico

text 
modale: {
 additional_styles: "@import url('https://fonts.googleapis.com/css?family=Arapey');",
 font_family: '"Arapey",serif;'
}

Minimo

Moderno

text 
modale: {
 font_family: '"PT Serif",serif;'
}

Vintage

text 
modale: {
 additional_styles: "@import url('https://fonts.googleapis.com/css?family=PT+Sans');",
 font_family: '"PT Sans","HelveticaNeue","Helvetica Neue",sans-serif;'
}

Moda

text 
modale: {
 additional_styles: "@import url('https://fonts.googleapis.com/css?family=PT+Sans');",
 font_family: '"PT Sans","HelveticaNeue","Helvetica Neue",sans-serif;'
}

Risultato

Ora ha aggiornato lo stile del pulsante e del modulo Torna in magazzino sul suo negozio Shopify.

Risorse aggiuntive

  • Come creare codici coupon univoci per Shopify

    Scopri come creare codici coupon monouso per il tuo negozio Shopify in modo che ogni cliente riceva il proprio codice coupon univoco per una determinata promozione sul tuo sito. Questa funzionalità fornisce un'alternativa alla creazione di un codice coupon generico, noto anche come codice coupon statico, in modo da non doversi preoccupare della condivisione dei codici.

Questo articolo è stato utile?
Usa questo modulo solo per il feedback sull'articolo. Scopri come contattare l'assistenza.

Esplora altri contenuti di Klaviyo

Community
Entra in contatto con altre aziende simili, partner ed esperti di Klaviyo per trovare ispirazione, condividere approfondimenti e ottenere risposte a tutte le tue domande.
Visita la Community
Partner
Assumi un esperto certificato Klaviyo per aiutarti con un compito specifico o per la gestione continua del marketing.
Assumi un partner
Assistenza

Accedi all'assistenza tramite il tuo account.

Assistenza via e-mail (prova gratuita e account a pagamento) Disponibile 24 ore su 24, 7 giorni su 7

Chat/assistente virtuale
 La disponibilità può variare in base alla località e al tipo di piano

Accedi