Search Results Widget

The search results widget provides view with search results

Embedding the Widget

  1. Ensure you've got a valid affiliate id.
  2. Create a new html page and add the following markup:
<!doctype html>
<html lang="en">
  <head>
    <title>Search resultswidget example</title>
  </head>
  <body>
    <div
        data-app="search-app"
        data-channel-id="masterdataelastic"
        data-view-name="search-results"
        data-object-type="PRD"
        data-object-subtype="SHW"
        data-results-only="true"
    ></div>
     <!-- js -->
    <script type="text/javascript" src="https://search-service.tixuk.io/vLatest/js/search-app.js"></script>
  </body>
</html>

Supported data attributes

In addition to the standard search data attributes, the following data attributes are used to customise the behaviour or 'look and feel' of the Input Search widget.

NameMandatoryTypeDescription
data-view-nameyesstringTitle of special widget's view user wants to insert. Represent widget type.

There are several views:

input-search
search-results
search-results-with-filters
search-cta
In case of this widget "search-results" should be used. Example:

data-view-name="input-search"
data-results-onlyNoString (boolean)Indicator on which form availability depends.

Example:

data-results-only="true"
When data-results-only is true, header input search is hidden.
data-use-urlNoString (boolean)Adds url navigation when user execute search event. User can save url in the bookmarks and later open page with specific results.

Example:

data-use-url="true"
data-use-url="false"
data-show-more-urlNoString (Url)Attribute which insert "see all" button at the end of result container. Url which is contained in data attribute will redirect page when user clicks this button.

Can contain relative and absolute path. Examples:

data-show-more-url="
/london/latest-shows"
(url will be [current origin] + /london/latest-shows after clicking)

data-show-more-url="
https://www.encoretickets.co.uk/
london-theatre/
musicals/the-lion-king"
(url will be https://www.encoretickets.co.uk/london-theatre/musicals/the-lion-king after clicking)
data-sort-byNoString (Boolean)For sub-type "GVC" only. Shows popup if existing basket has at least one product.
data-hide-basket-confirmation-popupNoString (Boolean)For sub-type "GVC" only. If this flag is enabled and gift-voucher is added to basket popup will show up. When this flag is disabled, user will be redirected to the basket page automatically
data-redirect-base-urlNoString (URL)For sub-type "GVC" only. This a path to basket page, where user will be redirected after clicking "add to basket" button.