Recommendations
Opret Design #
Recommendations vises som standard som en slider. Du kan enten bruge Design Editor til at konfigurere det visuelt eller bruge code designs.
Design Editor #
- Gå til Recommendations > Designs og klik på New Design.
- Vælg Product Slider
- Vælg en skabelon at starte fra, giv den et navn og klik på Create design.
- Justér designet efter behov.
Code Design #
- Gå til Recommendations > Designs og klik på New Design.
- Vælg Other designs > Blank > With code.
- Giv den et navn og klik på Create design.
- Opret et code design fra bunden ved at bruge Liquid code.
Hvis du ønsker et startsdesign, kan du se Slider template længere nede.
Opret Indhold #
Dette indeholder alle indstillinger, der bruges til at vise Recommendations-slideren og gøre den indlejrbar.
- Gå til Recommendations > Element.
- Klik på New Element.
- Giv den et beskrivende navn, f.eks. “Home / Visitor”.
- I Element type, vælg den produktlogik, der skal bruges.
- Vælg i Design det design, du har oprettet, og vælg antallet af produkter.
- Klik på Save.
Tilføj til Website #
For at tilføje Clerk Recommendations på dit website, har du to muligheder: Injection og Embedded code.
For at få adgang til dine tema-filer i Lightspeed, klik på “Design” i menuen til venstre og vælg “Code bewerken” i Geavanceerd dropdown-menuen.
For at tilføje synkroniseringsdetaljer eller starte en synkronisering, gå til my.clerk.io > Data > Configuration.
Pluginopsætning #
Ikke tilgængelig for Lightspeed. Brug opsætningen for my.clerk.io nedenfor.
my.clerk.io Opsætning #
Gå til Recommendations > Element.
Vælg det element, du vil indsætte.
Åbn fanen Insert into website
Vælg en af følgende:
- Ved at bruge injection kan du indsætte koden via en CSS selector.
- Ved at bruge embedded code kan du manuelt indsætte koden på dit website.
For embedded code på Lightspeed er typiske placeringer:
- Forside:
snippets/homepage.rain. - Produktside:
product.rainog sætdata-productstil[{{product.id}}]. - Kategori-side:
collection.rainog sætdata-categorytil{{ collection.category_id }}. - Brand-side: I
collection.rain, omslut brand-logik med en{% if collection.category_id %} ... {% else %} ... {% endif %}for at skelne. - Indkøbskurv-side:
fixed.rainmed en IF omkring embed-koden:{% if 'cart' in template %}…{% endif %}og sætdata-productstil:
data-products="[{% for clerk_line in page.cart.products %}{{ clerk_line.id }}{% if loop.length > 1 and not loop.last %}, {% endif %}{% endfor %}]"- Forside:
Powerstep #
Opret først din Recommendations Design og Element i my.clerk.io, som du vil tilføje til powerstep.
Find powerstep-snippet-filen i Snippets-sektionen i dine tema-filer, popup-buy.rain i dette eksempel. Indsæt embed-koden genereret fra dit Element her:
<div style="display: none;" id="clerk_powerstep">
<div class="clerk_powerstep_wrap">
<span class="clerk-powerstep-recommendations"
data-template="@power-step-others-also-bought"
data-products="[{{product.id}}]">
</span>
</div>
</div>
<script>
document.addEventListener('DOMContentLoaded', function(){
var buyBtn = (document.querySelector('[data-add-to-cart]')) ? '[data-add-to-cart]' : '.productCartButton';
document.querySelector(buyBtn).addEventListener('click', function(){
Clerk('content', '.clerk-powerstep-recommendations');
document.getElementById('clerk_powerstep').style.display = 'block';
});
});
</script>
Nogle embed-koder kræver variabler som produkt- eller kategori-ID’er. I disse tilfælde vil de blive udfyldt i embed-koden, men sørg for at dobbelttjekke, at det er de korrekte variabler, som skal refereres til i din Lightspeed-portal.
Indkøbskurv-side #
- I my.clerk.io, opret et Element med logikken Best Cross-Sell Products.
- I Insert into website > Choose your platform dropdown, vælg Lightspeed og kopier embed-koden.
- Indsæt embed-koden i din indkøbskurvskabelon (fx
fixed.rainmed en IF omkring embed-koden:{% if 'cart' in template %}…{% endif %}). Sætdata-productstil ID’erne på produkterne i kurven.
Exit Intent #
- I my.clerk.io, opret et Element med logikken Visitor Recommendations.
- Exit Intent tilføjes til din hovedtema-fil, sandsynligvis custom.rain.
- Placer Element-embed-koden genereret i my.clerk.io umiddelbart før det afsluttende
