Opgelet! We hebben een nieuwe documentatiesite en dit artikel is herschreven.
Bekijk de laatste versie van dit artikel →
Om de stappen te volgen zoals beschreven in dit artikel is basiskennis van HTML, Javascript en CSS vereist.
In dit artikel vind je hoe je Tweakwise recommendations kunt implementeren op basis van Javascript.
Step 1: Installeren
De recommendations kunnen worden geïnstalleerd door het volgende script aan de pagina toe te voegen. Wij adviseren dit script toe te voegen aan de <head> van de HTML.
<script src="https://gateway.tweakwisenavigator.net/js/recommendations.js"></script>
Step 2: Toevoegen aan de pagina
Nadat je het script hebt toegevoegd, ben je klaar om recommendations op de pagina te plaatsen. Je kunt ervoor kiezen om featured of cross- en upsell recommendations te gebruiken. Het is mogelijk om deze meerdere keren toe te voegen.
Let op: Wanneer je de recommendations meer dan eens aan de pagina toevoegt; zorg er dan voor dat je de HTML id en 'output' optie verandert in een unieke identifier.
Featured recommendations
Om uitgelichte aanbevelingen aan de pagina toe te voegen, kun je de volgende snippet aan je HTML toevoegen. Zorg ervoor dat je de snippit plaatst op de plek waar je de aanbevelingen op je pagina wilt tonen
<div id="tweakwise-featured-recommendations"></div>
<script>
window.addEventListener('DOMContentLoaded', function () {
tweakwiseRecommendations({
output: '#tweakwise-featured-recommendations',
instancekey: 'INSTANCE KEY',
featured: {
id: 'FEATURED RECOMMENDATIONS ID',
},
});
});
</script>
Cross- and upsell recommendations
Om cross- en upsell recommendations aan de pagina toe te voegen, kun je de volgende snippet aan je HTML toevoegen. Zorg ervoor dat je het sinippet plaatst op de plek waar je de aanbevelingen op je pagina wilt tonen.
<div id="tweakwise-related-recommendations"></div>
<script>
window.addEventListener('DOMContentLoaded', function () {
tweakwiseRecommendations({
output: '#tweakwise-related-recommendations',
instancekey: 'INSTANCE KEY',
related: {
productId: 'PRODUCT ID',
groupKey: 'GROUP KEY',
},
});
});
</script>