Manual initialization

Out of the box, the Search & Merchandising plugin will automatically start looking for an input, output and start the initialization.

If you need more control, for example if you want to initialize on your own terms, you can achieve this with some additional configuration.

Disable auto-initialization

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

Manually initialize

The tweakwiseListerPage method will use the configuration from Plugin Studio. It exposes some basic methods to interact with the plugin. See methods section.

<script>
  window.addEventListener('twn.starter.ready', function () {
    let listerPage = tweakwiseListerPage({
      output: '#tweakwise-output',
      cid: '1000',
      query: 'hoody',
      prettyUrl: true
    });    
    listerPage.setOpen(true);
  });
</script>

Note: In the snippet above the CID needs to be replaced with the ID of the category you want to show. This ID should be known in Tweakwise, as provided through the feed or Backend API.

Options

PropertyTypeDescription
outputtextA valid CSS Selector leading to a output element that should be used for the product lister page.
cidtextThe category ID that should be used to display the product lister page.
querytextThe search term to use in case of a search results page
prettyUrltextIf true and a SEO-friendly URL is provided in the feed or backend api , that value will be used in category links instead of the tweakwise-generated links.

Methods

Description
setOpenopen/close the search results
setQueryprovide or reset a searchterm
destroydestroy instance, for example to recreate a new one