blog Integrations

Hawksearch's Integration with Kentico Kontent Will Refine Your Search Experience

By Jonathan Meyer, Art Sbarounis, Paul Nashawaty Oct 23, 2019

In this blog post, we will describe a sample integration of the Content-as-a-Service solution, Kentico Kontent, with Hawksearch. But first, why is this integration important?

Why Kentico Kontent?

Kentico's Content as a Service allows your business to grow faster by connecting Kentico Kontent to best-of-breed collaboration, e-commerce, marketing, analytics, CRM and DAM tools. Deploy a connected, responsive content fabric that:

  • Unifies content silos
  • Drives conversion and desired action via machine learning
  • Connects and extends traditional CMS systems
  • Analyzes and optimizes content performance across all channels in one place

Why Hawksearch?

Hawksearch provides personalized and highly relevant search results for site visitors by harnessing artificial intelligence and machine learning technology. This machine learning streamlines the workload of our customers, while also being able to generate very accurate and personalized recommendation experiences for site visitors. Hawksearch has a variety of tools beyond search to assist with Merchandising, SEO, Analytics, and Business Intelligence. This is all included under one dashboard that has been designed for the ease of use.

Why Better Together?

With Hawksearch's laser focused features combined with Kentico Kontent, it becomes easier to create rich visitor experiences. Fetching results at the precise time, across the right channel of delivery, leveraging different systems of record to provide the best outcomes for your customer's journey. For Marketers, Hawksearch and Kentico Kontent provides the capability to deliver targeted messaging and promotions to site visitors. For Merchandisers, our combination provides the adaptability to highlight the content or products tailored to their goals. For Developers, our solution allows the possibility to accomplish more with less lines of code using the best of SaaS and custom development. 

Getting Started with Kentico Kontent and Hawksearch is Easy

Using the Hawksearch/Kentico connector makes installation easy. The connector will handle exporting the data and also allow you to easily handle the front-end integration on your website. This blog post will focus on how the Proxy/Hybrid UI integration works, which is our most common integration for Kentico Kontent users and is also the approach that our connector uses.

Requesting Search Results 

When a visitor performs a keyword search, the Search Results are requested from Hawksearch. Relevant results, facets, paging controls, and other objects are returned to guide a visitor to a result or an article. Search Results can be received through an API call (API Request for Search Results).

Query Parameters Examples

  • keyword: This value for this parameter is a search term used by the visitor. 
  • hawkoutput: The value is set to “custom” for receiving data in the hybrid format (some components as HTML and results as JSON). 
  • hawkitemlist: The value for this is set to JSON indicating that the results set will be returned as JSON.

Other components of the response can be returned back as JSON as well, instead of HTML. If you're interested in this, please inquire with your project team.

Hawksearch API Response

When the Hawksearch Engine is queried, the following objects are returned as part of the API Response.

  • Success: This indicates if the API Request was successful. 
  • Data: This object will contain the components related to the API Response. The data object will contain the following objects:
    • Title: This is the title of the page.
    • TopText: This object will contain the HTML text above the search results (expand results).
    • BreadCrumb: This object contains the HTML to display the breadcrumb with selected facets and/or keywords.
    • TopPager: This object contains the HTML for the pager above the search results.
    • BottomPager: This object contains the HTML for the pager below the search results.
    • Results: This object contains the results in JSON, HTML, or XML format depending on how the data is being requested. (See below for an example Results object)
    • Merchandising: This object contains the HTML to display merchandising and banner rules set up in the Dashboard. 
    • Selections: This object contains HTML for the selected Facets used for filtering.
    • Facets: This object contains HTML for the available Facets used for filtering.
    • FeaturedItems: If the Featured Items Banner has been set up for this query, this object contains HTML for this merchandising feature.
    • Location: This object contains the value of a redirect URL if set up through the Workbench. If exists, send the visitor to the URL and ignore the rest of the API response.
  • DidYouMean: This object contains the value for the spell check override specified in the Workbench for the appropriate keyword. This value will only contain the recommended keyword. 
  • TrackingId: This object contains the Tracking ID that is passed around for links on the Search Results page. Please refer to the Click Tracking section for more details.
  • MetaDescription: This object contains the SEO Field, Meta Description, for the requested Landing Page.
  • MetaKeywords: This object contains the SEO Field, Meta Keywords, for the requested Landing Page.
  • MetaRobots: This object contains the SEO Field, Meta Robots.
  • HeaderTitle: This object contains the SEO Field, Header Title. 
  • RelCanonical: This object contains the Canonical links. 

JSON ‘Results’ Object Example

"Results": [

      {

         "Score": 0.005307952,

         "ItemName": "Logo Hat - The North Face",

         "ImageURL": "/assets/1/14/DimThumbnail/{DE7A166C-24F5-453B-B970-A30BD746C21D}.jpg",

         "ImageAlt": "10187",

         "Id": "Item_74303",

         "CustomURL": "/products/logo-hat-the-north-face/",

         "TrackingId": "1213044",

         "Brand": "The North Face",

         "Price": "18",

         "SalePrice": "18",

         "IsOnSale": false,

         "BestFragment": "... - the <b>north<\/b> <b>face<\/b> the logo hat has the <b>north<\/b> <b>face<\/b> logo and &#39;1968&#39; embroidered on this washed cotton twill hat.&#60;br&#62; &#60;br&#62;   men accessories hats & headwear specials sat dec 15th kids women accessories hats & headwear women hats & headwear caps men hats & headwear caps the <b>north<\/b> ...",

         "MinPrice": "18",

         "MaxPrice": "18",

         "MinSalePrice": "0",

         "MaxSalePrice": "0"

      },

      {

         "Score": 7.017364E-4,

         "ItemName": "Baby Llama Beanie",

         "ImageURL": "/assets/1/14/DimThumbnail/The-North-Face-Baby-Llama-Beanie-jake-blue.jpg",

         "ImageAlt": "Llama",

         "Id": "Item_118551",

         "CustomURL": "/products/baby-llama-beanie-/",

         "TrackingId": "1213044",

         "Brand": "The North Face",

         "Price": "25",

         "SalePrice": "11.97",

         "IsOnSale": true,

         "BestFragment": "... design, the <b>north<\/b> <b>face<\/b> baby llama beanie is about the cutest thing you can pull on your baby&#39;s head. made from lightweight acrylic fibers, this <b>north<\/b> <b>face<\/b> hat has a fleece ear band for extra warmth and a soft feel against the skin.&#60;&#47;div&#62;&#60;div&#62;&#38;nbsp&#59;&#60;&#47;div&#62;&#60;&#47;div&#62;&#60;&#47;div&#62; ...",

         "MinPrice": "25",

         "MaxPrice": "25",

         "MinSalePrice": "11.97",

         "MaxSalePrice": "11.97"

      }

   ]

Displaying the Requested Search Results

Search Page/Listing Page

The Search Page/Listing Page handles the initial server load. It uses the connector and processes the response returned from the engine. Once the response has been processed, the HTML is rendered by the connector and HTML is returned to the page. 

Proxy Page

The Proxy Page acts as an intermediate page between Hawksearch and the site for any load following the initial server load (which is handled by the search page/listing page). The Proxy Page uses the connector and processes the response returned from Hawksearch.

HTML Elements

After the initial server side load of the results, Hawksearch's JavaScript is used to inject HTML from the proxy page on to the site page for subsequent loads. Below are the following divs which Hawksearch injects HTML into during subsequent loads.

    <div id="hawkbannerlefttop"><!-- Area for Banner  above filters on Top --> </div>

    <div id="hawkfacets"><!-- Area for Filters--></div>

    <div id="hawkbannerleftbottom"><!-- Area for Banner below filters --></div> 

    <div id="hawktitle"><!-- Area for page title --></div>

    <div id="hawkbreadcrumb"><!-- Area for breadcrumb --></div>

    <div id="hawkbannertop"><!-- Area for Banner Top --></div>

    <div id="hawktoptext"><!-- Area for message above search results --></div>

    <div id="hawktoppager"><!-- Area for Top Pager --></div>

    <div id="hawkitemlist"><!-- Area for Result Item/Content list --></div>

    <div id="hawkbannerbottom"><!-- Area for Banner below search results--></div>

    <div id="hawkbannerbottom2"><!-- Area for Banner below search results--></div>

    <div id="hawkbottompager"><!-- Area for Bottom Pager --></div>

Wrapping Up

With the Hawksearch/Kentico connector able to easily pull data from Kentico Kontent and the UI Integration steps outlined above, you are ready to take advantage of Hawksearch's powerful Machine Learning Automation and easy-to-use tools on your Kentico Kontent powered site.


Subscribe to Kentico Kontent Newsletter

Stay in the loop. Get the hottest updates while they're fresh!

Hello.

We are Kentico.