Come installare Klaviyo Reviews su Shopify (temi vintage e headless)

Tempo di lettura stimato 6 in minuti
|
Ultimo aggiornamento: 5 nov 2024, 10:46 EST
Imparerai

Imparerai

Scopra come installare Klaviyo Reviews con un tema Shopify vintage o con un'architettura headless. Questo processo consiste nel copiare diversi snippet di codice e incollarli nel codice del suo sito. 

Se utilizza un tema Shopify 2.0, può installare Klaviyo Reviews senza utilizzare il codice. Per saperne di più, consulti il nostro articolo su come iniziare a lavorare con Klaviyo Reviews. Se utilizza WooCommerce, apprenda come installare Klaviyo Reviews per WooCommerce

Questo processo richiede la modifica diretta dei file del suo tema in Shopify. Se non se la sente di farlo da solo, si rivolga al suo sviluppatore o contatti un partner Klaviyo per ricevere assistenza. 

Prima di iniziare

Prima di iniziare

Prima di incollare questi snippet di codice nel codice del suo sito, aggiunga l'applicazione Klaviyo Reviews al suo negozio Shopify. Per i temi vintage, attivi il monitoraggio onsite di Klaviyo

Installazione con architettura headless su Shopify

Installazione con architettura headless su Shopify

Per integrare le recensioni di Klaviyo con un negozio Shopify senza testa, aggiunga lo snippet di monitoraggio JavaScript di Klaviyo, noto anche come Klaviyo.js, a tutte le pagine in cui desidera aggiungere i widget delle recensioni (ad esempio, le pagine dei prodotti). Potrebbe aver già installato questo snippet se ha configurato il monitoraggio onsite di Klaviyo o i moduli di iscrizione. 

Scopra come installare Klaviyo.js per i negozi Shopify

Una volta aggiunto questo script al suo sito, proceda con i passi seguenti.

Aggiunga gli snippet di codice

Aggiunga gli snippet di codice

Gli snippet di codice qui sotto permettono di far apparire alcuni widget di recensioni in diverse aree del suo negozio. 

  • Il widget della valutazione in stelle visualizza l'attuale valutazione in stelle di un determinato prodotto e viene spesso installato sotto il nome del suo prodotto. 
  • Il widget di riepilogo delle recensioni mostra un grafico che suddivide tutte le valutazioni selezionate per un prodotto, le immagini inviate dagli utenti con le recensioni e i feedback più comuni ricevuti dal prodotto. Di solito è installato vicino alla parte inferiore della pagina del prodotto. 
  • Il widget delle recensioni dei prodotti è una combinazione dei widget del riepilogo delle recensioni e dell'elenco delle recensioni. Se aggiunge il widget delle recensioni dei prodotti al suo sito, non è necessario aggiungere separatamente i widget dell'elenco delle recensioni e del riepilogo delle recensioni.
  • Il widget Elenco recensioni visualizza un elenco di tutte le recensioni pubblicate e le domande dei clienti, oltre a una barra di ricerca, filtri, un pulsante Scrivi una recensione e un pulsante Fai una domanda. In genere viene installato immediatamente sotto il widget di riepilogo delle recensioni. 
  • Il widget carosello di recensioni in evidenza mostra le recensioni in evidenza di tutti i suoi prodotti. Questo può essere presente sulla sua homepage, su una pagina di recensioni indipendente o in qualsiasi altro punto del suo sito. Può selezionare le recensioni che vengono presentate in questo widget. Se disponibili, le immagini inviate dal cliente accompagnano ogni recensione; le immagini del suo prodotto vengono utilizzate se non è stata inviata alcuna immagine accanto alla recensione. 
  • Il widget SEO / Tutte le recensioni visualizza tutte le sue recensioni su tutti i prodotti in un'unica pagina. Utilizzi questo widget per migliorare il suo SEO e per fornire un unico luogo ai potenziali clienti per vedere ciò che i suoi clienti attuali amano. Questo widget viene spesso aggiunto ad una pagina di recensioni indipendente del suo sito.
Widget di valutazione a stelle

Widget di valutazione a stelle

Utilizzi il widget della valutazione a stelle per mettere in evidenza la valutazione media di un prodotto e il numero di recensioni che ha ricevuto.

Il widget della valutazione in stelle

Per installare questo widget sotto il titolo del suo prodotto: 

  1. Apra l'amministrazione del suo negozio Shopify. 
  2. Alla voce Canali di vendita, faccia clic su Online Store
  3. Clicchi sul menu con i tre puntini accanto al suo tema attuale > Duplica per creare un clone del suo tema attuale. 
  4. Dal menu a tre punti, faccia clic su Modifica codice.
    Il pulsante Modifica codice
  5. Cerchi "prodotto" nella barra di ricerca dei file e individui il file utilizzato per il contenuto della sua pagina prodotto. Potrebbe essere prodotto.liquido, modello-prodotto.liquid, o qualcosa di simile. (Se utilizza un modello di pagina di prodotto personalizzato, lo selezioni al suo posto).
    Ricerca del contenuto della pagina del prodotto
  6. Selezioni il file, quindi cerchi {{ product.title }} per individuare il codice che visualizza il titolo del suo prodotto.
    Codice del titolo del prodotto
  7. Aggiunga una nuova riga sotto questo codice. 
  8. Nella nuova riga, incolli questo frammento di codice:
    <div class="klaviyo-star-rating-widget" data-id="{{product.id}}" data-product-title="{{product.title}}" data-product-type="{{product.type}}"></div>
    Lo snippet di codice della valutazione a stelle
  9. Clicchi su Salva
  10. Clicchi su Anteprima negozio
  11. Si rechi alla pagina di un prodotto all'interno dell'anteprima del suo negozio. Dovrebbe vedere un widget a forma di stella sotto il titolo del prodotto. 
Widget per le recensioni dei prodotti

Widget per le recensioni dei prodotti

Utilizzi il widget Riepilogo recensioni ed Elenco recensioni (o solo il widget Recensioni prodotti) per aggiungere un riepilogo e un elenco di tutte le recensioni pubblicate per ogni prodotto sul suo sito. 

Riassunto della recensione con immagini

Per installare i widget di riepilogo e di elenco separatamente, si rechi nella sezione separata dei widget di riepilogo e di elenco delle recensioni qui sotto. 

Per installare questo widget: 

  1. Apra l'amministrazione del suo negozio Shopify. 
  2. Alla voce Canali di vendita, faccia clic su Online Store
  3. Clicchi su Personalizza accanto al suo tema attuale per modificarlo, oppure clicchi sul menu con i tre puntini > Duplica se desidera modificare una bozza di tema invece di quello attuale. 
  4. Dal menu a tre punti, faccia clic su Modifica codice.
    L'opzione Modifica codice
  5. Cerchi "prodotto" nella barra di ricerca dei file e individui il file utilizzato per il contenuto della sua pagina prodotto. Potrebbe essere prodotto.liquido, modello-prodotto.liquid, o qualcosa di simile. (Se utilizza un modello di pagina di prodotto personalizzato, lo selezioni al suo posto).
    Individuazione del contenuto della pagina del prodotto
  6. Selezioni il file, poi navighi fino in fondo (o dove desidera che appaia il widget del riepilogo e dell'elenco delle recensioni). 
  7. Aggiunga una nuova riga, quindi incolli questo frammento di codice:
    <div id="klaviyo-reviews-all" data-id="{{product.id}}"></div>
    Lo snippet di codice di tutte le recensioni
  8. Clicchi su Salva
  9. Clicchi su Anteprima negozio
  10. Si rechi in una pagina di prodotto all'interno dell'anteprima del suo negozio per un prodotto che ha delle recensioni. Dovrebbe vedere un widget di riepilogo e di elenco delle recensioni vicino alla parte inferiore della pagina.
Widget separati per il riepilogo delle recensioni e per l'elenco delle recensioni

Widget separati per il riepilogo delle recensioni e per l'elenco delle recensioni

Se preferisce installare i widget del riepilogo delle recensioni e dell'elenco delle recensioni separatamente (anziché insieme, come indicato nella sezione precedente), utilizzi i seguenti snippet di codice: 

Widget di riepilogo delle recensioni

<div id="klaviyo-reviews-summary" data-id="{{product.id}}"></div>

Widget per l'elenco delle recensioni

<div id="klaviyo-reviews-list" data-id="{{product.id}}"></div>

Widget carosello di recensioni in evidenza (opzionale)

Widget carosello di recensioni in evidenza (opzionale)

Il carosello di recensioni in evidenza visualizza recensioni selezionate a mano su qualsiasi pagina da lei scelta (ad esempio, la sua home page). 

Il widget carosello di recensioni in evidenza

Per aggiungere un carosello che mostri tutte le sue recensioni in evidenza, deve prima selezionare le recensioni da inserire. 

  1. Nella navigazione principale di Klaviyo, selezioni Recensioni
  2. Clicchi su tutte le recensioni.
  3. Accanto alla recensione che desidera mettere in evidenza, clicchi su Caratterizza.
    L'opzione di presentare una recensione

Una volta selezionate diverse recensioni da inserire nel suo sito, può installare un widget carosello di recensioni su qualsiasi pagina. Si colleghi alla pagina in cui desidera che appaia il carosello, quindi incolli il seguente snippet nel codice della pagina: 

<div id="klaviyo-featured-reviews-carousel"></div>

SEO / Tutte le recensioni widget (opzionale)

SEO / Tutte le recensioni widget (opzionale)

Il widget SEO / Tutte le recensioni visualizza tutte le recensioni pubblicate per ogni prodotto. Lo aggiunga a una pagina di Recensioni indipendente, o alla sua pagina Informazioni.

<div id="klaviyo-reviews-all" data-id="all"></div>

widget di tutte le recensioni

Risultato

Risultato

Una volta installati i widget descritti in questo articolo e impostato il nuovo tema, le sue recensioni appariranno nelle pagine dei prodotti (e in tutte le altre pagine del suo sito in cui le ha installate). 

Risorse aggiuntive

Risorse aggiuntive

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

Esplora altri contenuti di Klaviyo

Community
Connettiti con altre aziende simili, partner ed esperti di Klaviyo per trovare ispirazione, condividere approfondimenti e ottenere risposte a tutte le tue domande.
Formazione dal vivo
Partecipa a una sessione dal vivo con gli esperti di Klaviyo per conoscere le linee guida consigliate, scoprire come configurare le funzionalità chiave e altro ancora.
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