StatusSupport
Tweakwise.comTweakwise AppContact

Recommendations JS

Quick start

To get started with the Recommendations JS add the following script to the HTML. We recommend adding this script to the <head> of the HTML.

<link rel="preload" as="script" href="https://gateway.tweakwisenavigator.net/js/recommendations.js" />
<script>
  window.tweakwiseFailover = function (src) {
    var script = document.createElement("script");
    script.async = true;
    script.src = src;
    document.head.appendChild(script);
  };
</script>
<script
  src="https://gateway.tweakwisenavigator.net/js/recommendations.js"
  data-failover="https://gateway.tweakwisenavigator.com/js/recommendations.js"
  onerror="window.tweakwiseFailover(this.dataset.failover)"
></script>

After the script has been added to the page you can initialize the Recommendations JS. You can choose to either show featured or up- and cross sell recommendations to the page.

Featured recommendations

To add featured recommendations; copy the following snippet to the page. The snippet should be placed on the position of where you want the recommendations to appear.

<div id="featured-recommendations"></div>

<script>
  window.addEventListener("DOMContentLoaded", function () {
    window.tweakwiseRecommendations({
      output: "#featured-recommendations",
      instancekey: "INSTANCEKEY",
      featured: {
        id: "ID"
      }
    });
  });
</script>

The only thing that is left is to replace INSTANCEKEY and ID with the correct values.

The INSTANCEKEY should be replaced with your own instance key. You can find it in the Tweakwise App under Connectivity > Endpoints.

The ID should be replaced with the unique featured recommendations ID. You can find this ID in the Tweakwise App.

Up- and cross sell recommendations

To add up- and cross sell recommendations; copy the following snippet to the page. The snippet should be placed on the position of where you want the recommendations to appear.

<div id="related-recommendations"></div>

<script>
  window.addEventListener("DOMContentLoaded", function () {
    window.tweakwiseRecommendations({
      output: "#related-recommendations",
      instancekey: "INSTANCEKEY",
      related: {
        productId: "PRODUCTID",
        groupKey: "GROUPKEY"
      }
    });
  });
</script>

The only thing that is left is to replace the INSTANCEKEY, PRODUCTID and GROUPKEY with the correct values.

The INSTANCEKEY should be replaced with your instance specific key.

the PRODUCTID should be replaced with the ID of the product for which you want to show recommendations.

the GROUPKEY should be replaced with the group key that is linked to the up- and cross sell recommendations. You can find this key in the Tweakwise App.