Heads up! We have a new documentation site and this article has been rewritten.

Check out the latest version of this article →

To follow the steps as described in this article a basic knowledge of HTML, Javascript and CSS is required.

In the JS implementation it is possible to place an add-to-cart button on your product tile. When this button is clicked, an event is triggered inside the JS implementation.

It is possible to act on this event. This is done by extending the configuration object on the page with the "on" option. In this option you can use a Javascript function to act on specific events. In the example below you can see how you can provide a Javascript function for the "add-to-cart" event.

In case of a Tweakwise hosted implementation there is a possibility that this configuration object is not yet preset on the page. In this case you can place an empty configuration object on the page with only the "on" option filled in.

It is the customer's responsibility to extend the Javascript function in such a way that the product is actually placed into the shopping cart. Because every website is unique it is impossible for us to do this for the customer.

 

<script>
  window['twn-starter-config'] = {
    // Possbile other options...

    on: {
      'twn.add-to-cart': function (event) {
        var tweakwiseProductId = event.data.itemno;
        // Place the product in the shopping cart here using Javascript code
      },
    },
  };
</script>