Basic web app configuration

To get started with Tweakwise JS using Plugin Studio, add your personalized JavaScript file to the page.

Copy the following snippet into the <head> of your HTML.

<link rel="preload" as="script" href="https://gateway.tweakwisenavigator.net/js/starter.js" />
<link rel="preload" as="script" href="https://gateway.tweakwisenavigator.net/js/INSTANCEKEY/tweakwise.js" />

<script>window["twn-starter-config"] = window["twn-starter-config"] || {};</script>

<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/INSTANCEKEY/tweakwise.js"
  data-failover="https://gateway.tweakwisenavigator.com/js/INSTANCEKEY/tweakwise.js"
  onerror="window.tweakwiseFailover(this.dataset.failover)"
></script>

Important: after you have added the snippet to your frontend replace INSTANCEKEY with your own instance key.

💡

You can find it in the Tweakwise App under Connectivity > Endpoints.

Good to know

  • Besides importing the JavaScript file the snippet tells the browser that the plugin should be loaded with a high priority.
  • It also creates a fallback mechanism to an alternative domain. This is done to optimize the performance and stability of the solution.
  • When Tweakwise JS has loaded, it will begin to process the twn-starter-config configuration object. Any changes to the object after initialisation will not have effect.
  • The twn-starter-config configuration object is also for Suggestions JS, Recommendations JS and Guided Selling JS.