Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

Info

Configured Hawksearch widgets - Kentico: Working with widgets

Extending the

...

templates

  • In order to

...

  • override the default view file the Hawksearch search box widget uses you need to create a razor view file in your ASP .NET Core project at Views/Shared/Components/SearchBox/Default.cshtml.

  • In order to add additional templates, create corresponding view files under Views/Shared/Components/SearchBox/ .

    When displayed in the widget settings, they will be split by capital letters and words after the first will be lowercased. So a view file called β€œSearchBoxTemplateOneβ€œ will be displayed like β€œSearch box template one” in the widget settings.

    The way the connector is designed it will automatically find

...

  • the razor view files in that folder and use them. Below is the

...

  • Default.cshtml code used.

Code Block
@model Hawksearch.Kentico.Xperience.UI.Widgets.SearchBoxViewModel

@{
    var trackedEvents = new List<string>()
{
        Model.ComponentViewModel.Properties.TrackAutocompleteClickEvent ? "AutocompleteClick" : "",
        Model.ComponentViewModel.Properties.TrackSearchEvent ? "Search" : ""
    };

    var eventsJson = Newtonsoft.Json.JsonConvert.SerializeObject(trackedEvents.Where(a => !string.IsNullOrEmpty(a)));
    var settingsJson = Newtonsoft.Json.JsonConvert.SerializeObject(Model.ConnectorSettings);
}

<div class="vue-app-wrapper-ae" style="display:flex;"
     data-indexname="@Model.ComponentViewModel.Properties.IndexName"
     data-trackedevents="@eventsJson"
     data-hawksearchsettings="@settingsJson">
    <div class="hawk">
        <div class="hawk__header">
            @if (string.IsNullOrWhiteSpace(Model.SearchPageUrl))
            {
                <search-box></search-box>
            }
            else
            {
                <search-box search-page="@Model.SearchPageUrl"></search-box>
            }
        </div>
    </div>
</div>

...