Favoriete knoppen weergeven op je site en in Klaviyo Customer Hub

Wat je leert

Lees hoe je shoppers hun favoriete artikelen op je site kunt laten opslaan. Door favorietenknoppen naast je producten toe te voegen, kun je de opgeslagen artikelen van shoppers weergeven in de lade van Klaviyo Customer Hub en follow-upflows verzenden om conversie te stimuleren.

Voordat je van start gaat

In deze handleiding lees je hoe je de instelling Favorieten inschakelt via de instellingen van de Klaviyo Customer Hub in Klaviyo en hoe je favoriete knoppen toevoegt op verschillende pagina's van je website. Voordat je doorgaat, moet je ervoor zorgen dat de Klaviyo Customer Hub-functie is ingeschakeld in Klaviyo.

Meer informatie over Klaviyo Customer Hub.

Over favorieten

Met favorietenknoppen kunnen shoppers producten opslaan waarin ze geïnteresseerd zijn. De favorieten van een shopper worden weergegeven in de lade van de Klaviyo Customer Hub en kunnen worden gebruikt in flows om extra conversie te stimuleren.

Wanneer je de functie Favorites activeert in je instellingen voor Klaviyo Customer Hub, verschijnt er een favorietenknop bij alle producten die worden weergegeven in de interface van Klaviyo Customer Hub. Wanneer een shopper op deze knop klikt, wordt het item toegevoegd aan de sectie Favorites en opgeslagen in zijn of haar Klaviyo-profiel.

Om ze beter zichtbaar te maken en het gebruik te stimuleren, kun je ook favorietenknoppen toevoegen aan:

• Pagina's met productgegevens
• Collectiepagina's (ook wel "productlijstpagina's" genoemd)

Items die je als favoriet hebt gemarkeerd op een van deze pagina's worden ook opgeslagen in de sectie Favorieten van shoppers in de lade van Klaviyo Customer Hub. Let op: elke bezoeker kan producten toevoegen aan zijn of haar favorietenlijst, ongeacht of diegene is ingelogd op een klantaccount. Wanneer ze inloggen, worden alle favorieten die ze hebben opgeslagen gesynchroniseerd met hun Klaviyo-profiel.

Schakel favorieten in om weer te geven in de Klaviyo Customer Hub

Als je favorieten wilt weergeven in de Klaviyo Customer Hub-lade, moet je eerst de instelling Favorieten in Klaviyo inschakelen.

1. Selecteer in Klaviyo's hoofdmenu aan de linkerkant Service - Klaviyo Customer Hub.
2. Klik op het tabblad Extensies .
3. Vink onder Favorieten, het vakje aan om Favorieten inschakelen.
   

4. Selecteer in de dropdown Pictogram kiezen welk type favorietenpictogram je onder je producten wilt weergeven (dus een hartje of een plusteken).
   • Standaard toont het voorbeeld de niet-geselecteerde (d.w.z. niet als favoriet gemarkeerde) versie van het pictogram. Klik op het pictogram in het voorbeeld om te zien dat het verandert naar de favorietenstatus.
5. Klik op Opslaan.

Er verschijnt nu een favorietenknop onder alle producten die worden getoond in de interface van de Klaviyo Customer Hub. Als je erop klikt, wordt het item toegevoegd aan de sectie Favorieten.

Ga verder naar de volgende sectie voor richtlijnen voor het toevoegen van favorietenknoppen aan productdetailpagina's.

Bestaande verlanglijstjes importeren naar Klaviyo Customer Hub

Als je overstapt op de Klaviyo Customer Hub van een andere verlanglijst-applicatie, kun je de opgeslagen items van je klanten naadloos migreren met een redelijk verliesarme datamigratie. Klaviyo biedt een standaard workflow om historische favorieten- en verlanglijstgegevens te importeren, zodat je shoppers hun opgeslagen producten niet kwijtraken.

Imports van native apps

Klaviyo biedt native ondersteuning voor het direct importeren van gegevens uit populaire verlanglijst-apps, waaronder:

• Swym
• Wishlist King

Importeren via csv

Als je migreert vanaf een andere aanbieder van verlanglijsten, kun je je data rechtstreeks importeren in Klaviyo. Ga naar de instellingen voor favorieten van Klaviyo Customer Hub en sleep je CSV-bestand naar het uploadgedeelte – geen template vereist. De importeur herkent automatisch de indeling van je bestand en koppelt de data dienovereenkomstig om de profielen van je shoppers in Klaviyo Customer Hub te vullen.

Favorietenknoppen toevoegen aan productdetailpagina's

Zorg voor aanzienlijk hogere betrokkenheid door "toevoegen aan favorieten"-knoppen toe te voegen aan je productdetailpagina's.

1. Selecteer bij de instelling Favorieten in Klaviyo Appblok toevoegen.
2. Hierdoor wordt je Shopify thema-editor in een nieuw venster geopend, met een modal die aangeeft dat het app-blok Klaviyo Favorites is toegevoegd aan je standaard template voor productpagina's. Klik op Begrepen.
   

3. Klik en sleep de app om de positie op je pagina met productgegevens naar wens aan te passen.
4. Klik wanneer je klaar bent op Opslaan om je wijzigingen op te slaan in Shopify. Op dit punt worden favorietknoppen onder producten op je productpagina's weergegeven.
5. Optioneel: ga voor extra styling terug naar Klaviyo. Met de dropdown App block style kun je het uiterlijk van de favorietenknop op productpagina's aanpassen. Kies een optie:
   • Overnemen om de knopstijlen van je site te synchroniseren (standaard).
   • Aangepast om een specifiek lettertype en een specifieke tekstkleur voor de knop te selecteren.
     

6. Sla wijzigingen op.

Ga terug naar je website. Je ziet dat favorietenknoppen onder producten op je productdetailpagina’s worden ingevuld.

Ga vervolgens verder naar het gedeelte Knoppen voor favorieten toevoegen aan je collectiepagina's.

Installeer handmatig favoriete knoppen (vintage thema's of aangepaste installatie)

Als je een vintage Shopify-thema gebruikt of een aangepaste setup die geen app-blokken ondersteunt, moet je mogelijk de Klaviyo Wishlist-app handmatig installeren op de pagina's waar je favorietacties wilt (bijv. productpagina's).

Dit doe je zo:

1. Open de beheeromgeving van je Shopify-webshop.
2. Selecteer onder verkoopkanalen Online store.
3. Klik op het menu met de drie stippen in je huidige thema en selecteer Code bewerken. Als je dit liever test op een conceptthema, dupliceer dan eerst je huidige thema en bewerk daarna de code van het gedupliceerde thema.
   

4. Zoek het bestand voor je productdetailpagina. Dit verschilt per thema, maar bevat meestal het woord "product" in de naam. In het Dawn-thema heet dit bijvoorbeeld "main-product.liquid."
5. Plak het volgende codefragment op de plek waar je de favorietenknop wilt laten verschijnen:
   <div class="klaviyo-wishlist-slot" data-product-id="{{ product.id }}"></div>
6. Klik op Opslaan.
7. Klik op Voorbeeldwinkel.
8. Ga naar een productpagina in de voorbeeldweergave van je winkel. De toegevoegde favorietenknop moet zichtbaar zijn op de aangewezen locatie.

Favoriete knoppen toevoegen aan je collectiepagina's

Installeer een klein stukje code op je Shopify-site om favorietenknoppen toe te voegen aan je collectiepagina's, zodat shoppers tijdens het browsen door je producten snel items kunnen opslaan. Dit is vooral handig voor shoppers op mobiele apparaten.

Dit doe je zo:

1. Open de beheeromgeving van je Shopify-webshop.
2. Selecteer onder verkoopkanalen Online store.
3. Klik naast je huidige thema op het menu met de drie puntjes en selecteer vervolgens Code bewerken.
   • Als je wilt testen op een conceptthema, dupliceer dan eerst je huidige thema en bewerk daarna de code in het gedupliceerde thema.
4. Zoek in de linkerzijbalk naar je collectiebestand en open het. Voor dit voorbeeld gebruiken we het bestand featured-collections.liquid, maar je thema kan een ander bestand gebruiken.
   

5. Gebruik in het collections-bestand de zoekfunctie (Command+F op Mac of Control+F op Windows) om het woord "render" in het bestand te zoeken. Dit helpt je de snippetnaam te identificeren die je productraster bevat.
   • Het snippet wordt waarschijnlijk weergegeven in een indeling zoals: {% render 'snippet-name'%}, waarbij 'snippet-name' de naam is van het relevante snippetbestand (bijv. card-product).
     

6. Zoek in de linkerzijbalk naar het snippetbestand dat in de vorige stap is geïdentificeerd en open het (bijvoorbeeld card-product.liquid).
7. Bovenaan dit bestand noteer je de objectwaarde die onder "Accepts" staat (bijv. "card_product").
   

8. Kopieer de volgende code en plak deze in het snippetbestand:
   • Tip: Zoek naar het eerste moment waarop de prijs in je bestand wordt weergegeven en plak de code erboven.
     <div

    class="klaviyo-favorites-plp-slot"

   data-product-id="{{ OBJECT.id }}"

   data-product-url="{{ OBJECT.url }}"

   data-variant-id="{{OBJECT.selected_or_first_available_variant.id}}"

  ></div>
9. Vervang in de code die je hebt geplakt OBJECT door de objectwaarde die je eerder hebt genoteerd.
   • Als de objectwaarde van je bestand bijvoorbeeld “card_product” is, ziet de code er zo uit wanneer je die in het bestand hierboven boven de prijs plakt.
     

10. Klik op Opslaan in Shopify.
11. Ga naar de collectiepagina van je site en vernieuw de pagina.

Je zou nu de favorietknoppen op elk product moeten zien verschijnen. Let op: het kan een paar seconden duren voordat deze zijn geladen. Standaard staan ze in de rechterbovenhoek. Als je de positie wilt wijzigen, vraag dan je ontwikkelaar om hulp met aangepaste CSS.

Als de favorietenknoppen nog steeds niet zijn verschenen, probeer dan deze stappen voor probleemoplossing:

• Bevestig dat je OBJECT in het codefragment hebt vervangen door de objectwaarde van je bestand.
• Probeer de code ergens anders in het bestand te plakken.
• Controleer of je de code in het juiste snippetbestand hebt geplakt.

Als ze nog steeds niet verschijnen, vraag dan hulp aan een ontwikkelaar. Het supportteam van Klaviyo kan je themabestanden niet rechtstreeks bewerken.

Volgende stappen

Nu je favorietenknoppen aan je site hebt toegevoegd, stel je een herinneringsflow voor favorieten in om conversies te stimuleren door shoppers te herinneren aan hun onlangs opgeslagen items.

Extra hulpbronnen