The search cta widget allows user to call search overlay withing the page.
This widget is deprecated. Please speak to your account manager about an alternative solution.
Embedding the Widget
- Ensure you've got a valid affiliate id.
- Create a new html page and add the following markup:
<!doctype html>
<html lang="en">
<head>
<title>Search CTA widget example</title>
</head>
<body>
<div
data-app="search-app"
data-affiliate-id="encoretickets"
data-view-name="search-cta"
data-target-overlay-div="navigation-bar"
></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.
| Name | Mandatory | Type | Description |
|---|---|---|---|
| data-view-name | yes | string | Title 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-cta" should be used. Example: data-view-name="search-cta" |
| data-target-overlay-div | Yes | String | Class name of container when user wants to insert widget. Usually, it's navigation bar. Example: data-target-overlay="navigation bar" |
| data-overlay-only | No | Boolean | Shows overlay container without CTA button Example: data-overlay-only="true" |