Hoe Klaviyo Recensies installeren op Shopify (vintage thema's en headless)
Wat je leert
Leer hoe je Klaviyo Reviews installeert met een vintage Shopify thema of headless architectuur. Dit proces houdt in dat je verschillende codefragmenten kopieert en in de code van je site plakt.
Als je een Shopify 2.0 thema gebruikt, kun je Klaviyo Recensies installeren zonder code te gebruiken. Ga naar ons artikel over Aan de slag met Klaviyo beoordelingen voor meer informatie. Als je WooCommerce gebruikt, leer dan hoe je Klaviyo Recensies voor WooCommerceinstalleert.
Dit proces vereist het direct bewerken van je themabestanden in Shopify. Als je dit zelf niet goed kunt, neem dan contact op met je ontwikkelaar of neem contact op met Klaviyo partnervoor hulp.
Voordat je van start gaat
Voordat je deze codefragmenten in de code van je site plakt, voeg je de Klaviyo Recensies app toe aan je Shopify zaak. Voor vintage thema's kun je Klaviyo's onsite trackinginschakelen.
Installeren met headless architectuur op ShopifyInstalleren met headless architectuur op Shopify
Om Klaviyo Recensies te integreren met een headless Shopify zaak, voeg je Klaviyo's JavaScript tracking snippet, ook bekend als Klaviyo.js, toe aan alle pagina's waar je de recensies widget wilt toevoegen (bijv. productpagina's). Je hebt dit knipsel misschien al geïnstalleerd als je Klaviyo's onsite tracking of aanmeldingsformulier hebt geconfigureerd.
Leer hoe je Klaviyo.js installeert voor Shopify zaak.
Zodra je dit script aan je site hebt toegevoegd, kopieer je het codefragment in de onderstaande stappen naar de code van je site.
Voeg de codefragment toeVoeg de codefragment toe
Met de onderstaande codefragmenten kun je bepaalde beoordelingen op verschillende plaatsen in je zaak weergeven.
- De widget met de sterrenclassificatie toont de huidige sterrenclassificatie voor een bepaald product en wordt meestal geïnstalleerd onder de naam van je product.
- De widget met het overzicht van beoordelingen toont een grafiek met een onderverdeling van alle beoordelingen die voor een product zijn geselecteerd, afbeeldingen van gebruikers die bij beoordelingen zijn ingediend en de meest voorkomende feedback die het product heeft ontvangen. Het wordt meestal onderaan een productpagina geïnstalleerd.
- De product recensies widget is een combinatie van de recensies samenvatting en recensies lijst widget. Als je de productbeoordelingen widget aan je site toevoegt, hoef je de beoordelingslijst en beoordelingsoverzicht widget niet apart toe te voegen.
- De recensielijst widget toont een lijst van alle gepubliceerde recensies en klantvragen, samen met een zoekbalk, filters, een knop Schrijf een recensie en een knop Stel een vraag. Deze wordt meestal direct onder de widget met de samenvatting van de recensies geïnstalleerd.
- De widget met uitgelichte beoordelingen toont uitgelichte beoordelingen van al je producten. Dit kan op je homepage, op een aparte pagina met recensies of ergens anders op je site. Je kunt de beoordelingen selecteren die in deze widget worden weergegeven. Als er afbeeldingen beschikbaar zijn, worden deze bij elke recensie geplaatst; als er geen afbeelding bij de recensie is geplaatst, worden jouw productafbeeldingen gebruikt.
- De SEO / Alle beoordelingen widget toont al je beoordelingen over alle producten op één pagina. Gebruik deze widget om je SEO te verbeteren en potentiële klanten op één plek te laten zien waar je huidige klanten van houden. Deze widget wordt meestal toegevoegd aan een aparte pagina met recensies op je site.
Sterrenscore widget
Gebruik de sterrenwaardering widget om de gemiddelde waardering van een product en het aantal beoordelingen dat het heeft ontvangen duidelijk te laten zien.
Om deze widget onder de titel van je product te installeren:
- Open je Shopify zaak admin.
- Klik onder Verkoopkanaal op Webshop.
- Klik op het menu met de drie puntjes naast je huidige thema > Dupliceren om een klonen van je huidige thema te maken.
- Klik in het menu met de drie puntjes op Code bewerken.
- Zoek "product" in de bestandszoekbalk en zoek het bestand dat wordt gebruikt voor de inhoud van je productpagina. Het zou product.liquid kunnen zijn, product-template.liquid, of iets dergelijks. (Als je een aangepaste productpagina template gebruikt, selecteer die dan).
- Selecteer het bestand en zoek dan naar {{ product.title }} om de code te vinden die de titel van je product weergeeft.
- Voeg een nieuwe regel toe onder deze code.
- Plak op de nieuwe regel dit codefragment:
<div class="klaviyo-star-rating-widget" data-id="{{product.id}}" data-product-title="{{product.title}}" data-product-type="{{product.type}}" ></div> - Klik op Opslaan.
- Klik op Voorbeeld zaak.
- Navigeer naar een productpagina binnen je zaak preview. Je zou een widget met sterren moeten zien onder de titel van het product.
Widget voor productreviews
Gebruik de review samenvatting en review lijst widget (of alleen de product review widget) om een samenvatting en lijst toe te voegen van alle gepubliceerde reviews voor elk product op je site.
Om de samenvatting en lijst widget apart te installeren, ga je naar de aparte review samenvatting en review lijst widget sectie hieronder.
Om deze widget te installeren:
- Open je Shopify zaak admin.
- Klik onder Verkoopkanaal op Webshop.
- Klik op Aanpassen naast je huidige thema om het te bewerken, of klik op het menu met de drie puntjes > Dupliceren als je een ontwerpthema wilt bewerken in plaats van je live thema.
- Klik in het menu met de drie puntjes op Code bewerken.
- Zoek "product" in de bestandszoekbalk en zoek het bestand dat wordt gebruikt voor de inhoud van je productpagina. Het zou product.liquid kunnen zijn, product-template.liquid, of iets dergelijks. (Als je een aangepaste productpagina template gebruikt, selecteer die dan).
- Selecteer het bestand en navigeer dan helemaal naar beneden (of waar je de widget met de overzichten en de lijst ook wilt weergeven).
- Voeg een nieuwe regel toe en plak dan dit codefragment:
<div id="klaviyo-reviews-all" data-id="{{product.id}}" ></div> - Klik op Opslaan.
- Klik op Voorbeeld zaak.
- Navigeer naar een productpagina binnen je zaak preview voor een product met recensies. Je ziet nu een widget met een overzicht van beoordelingen en een lijst onderaan de pagina.
Aparte beoordelingssamenvatting en beoordelingslijst widget
Als je er de voorkeur aan geeft om de review samenvatting en review lijst widget apart te installeren (in plaats van samen, zoals hierboven beschreven), gebruik dan het volgende codefragment:
Samenvatting widget
<div id="klaviyo-reviews-summary" data-id="{{product.id}}" ></div>
Overzicht lijst widget
<div id="klaviyo-reviews-list" data-id="{{product.id}}" ></div>
Uitgelichte recensie widget (optioneel)
De uitgelichte recensies carrousel toont handgeselecteerde recensies op elke pagina die je kiest (bijvoorbeeld je startpagina).
Om een carrousel toe te voegen die al je uitgelichte beoordelingen weergeeft, moet je eerst beoordelingen selecteren op functies.
- Selecteer Reviews in de hoofdnavigatie van Klaviyo.
- Klik op alle beoordelingen.
- Klik op functies naast de recensie die je wilt gebruiken.
Als je eenmaal verschillende beoordelingen hebt geselecteerd voor functies op je site, kun je op elke pagina een beoordelingscarrousel widget installeren. Navigeer naar de pagina waar je de carrousel wilt laten verschijnen en plak dan het volgende fragment in de code van die pagina:
<div id="klaviyo-featured-reviews-carousel"></div>
SEO / Alle beoordelingen widget (optioneel)
De SEO / Alle beoordelingen widget toont alle gepubliceerde beoordelingen van elk product. Voeg dit toe aan een op zichzelf staande Recensies-pagina of aan je Over pagina.
<div id="klaviyo-reviews-all" data-id="all"></div>
Resultaat
Zodra je de widget uit dit artikel hebt geïnstalleerd en het nieuwe thema live hebt gezet, verschijnen je beoordelingen op productpagina's (en op alle andere pagina's op je site waar je ze hebt geïnstalleerd).
Extra hulpbronnen