Klevu Headless Showcase

by Joseph McDermott on Jun 03 2021

At Klevu we are always striving to make it easier for retailers to create beautiful product discovery experiences for their customers. We have recently overhauled our API to allow some incredibly powerful features such as multiple search queries within a single API request, allowing lightning fast experience even when displaying all sorts of complex data to your customers.

We also launched Klevu JavaScript Library, allowing complete control of the look, feel and functionality of any search integration involving Klevu, removing all obstacles to your creativity.

This short article showcases some of the amazing headless implementations that retailers  and solution integrators in the amazing Klevu ecosystem have created with our powerful toolkits.

Toteme

APIv2 – We Make Websites

https://int.toteme-studio.com

Beautifully simple, full-page search.

We Make Website (WMW) used our API to craft a minimalist search which seamlessly integrates with their client’s brand, Toteme.

James Peilow, Senior Front-end Developer, We Make Websites said, “By choosing to use Klevu’s JSv2 API, we were granted complete freedom and flexibility over the markup and design of Totême’s search results’ overlay. This allowed us to create a Search UI that was in keeping with the brand’s identity, consistent with broader site designs, and matched the functionality of their previous site too. 

“The search UI was built using vanilla JS and by making various requests to the JSv2 search endpoint. The JSv2 documentation provided by Klevu made this a breeze to get up and running. For instance, the side panel to test requests for each section of the documentation meant it was easy to test out a request and see what response to expect back. Moreover, the Multiple Queries example was used to create a single search request that returned both the product data and page data, whilst the Filtering Results section helped for surfacing and applying the search filters for product sizes.”

Suggested searches appear before you even start typing, populated using Klevu pre-generated popular searches from recent site interactions across all customers.

CMS Search, Filter Search and Product Search are all powered by a single API call, taking full advantage of Klevu multiple queries to give lightning fast search results.

A single, most commonly used filter, “size”, is displayed without any fuss, utilising Klevu facet and filtering functionality, which comes as standard for all plans.

Search results from Klevu perfectly match the branding of the homepage, landing pages and category pages by using Klevu as a headless search provider and integrating the results directly into their custom frontend.

Skin Society

Klevu JavaScript Library – Eastline Digital

https://www.skinsociety.me/

Advanced filtering applied directly to quick search results.

Eastline Digital took full advantage of Klevu’s multi-search query functionality to separate results by product type, showcasing relevant results from Professional Skin Care, Dermocosmetics, Luxury, etc. as soon as the customer begins typing.

Brewdog

API + React – Brewdog

https://www.brewdog.com

Klevu quick search powered by React JS headless technology.

A perfect brew of products, categories, content and support articles, blended together using the incredibly powerful headless JavaScript toolkit, React JS.

Faberge

Klevu JavaScript Library

https://www.faberge.com

Removing the complexity of some very complex price logic.

Faberge has some very complex pricing rules for their product ranges, with calculations based on a mixture of tax, currency and shipping destination. The developers were able to keep this business logic within their control by replacing prices in realtime after the search results have been retrieved from the Klevu API.

Somm Cellars Wine

Klevu JavaScript Library – Omnicode

https://sommcellarswine.com 

“Wine List” themed search results listings.

Omnicode used the Klevu JavaScript Library to re-imagine some of the common widgets like grid and list view into a more appropriate ‘detailed’ and ‘wine list’ view, keeping the search results in line with their brand. Custom facets for wine type and country allow their customers to find exactly what they want to drink next.

Healthy Planet

Klevu JavaScript Library – Calvus

https://www.healthyplanetcanada.com 

Automatic search on suggestions hover, to show even more relevant results instantly.

Calvus took advantage of the speed of Klevu API by fetching relevant results for search suggestions as soon as they are hovered, giving customers an instant snapshot into the products they may be interested in.

Summary

Search and product discovery is becoming so much more than just displaying a fixed grid of product cells with a “here’s your results” title. Our customers are surprising us every day with the amazing creativity our platform is allowing them.

Why not use custom attributes to create “hero products” which span more than one cell, or show non-product content such as instagram posts or blog articles right within your search results. Search is an amazing opportunity to wow your customers with your creativity.

We can’t wait to showcase what our partners come up with next!

Further resources:

• Headless Ecommerce Masterclass [On Demand Webinar]
• Klevu Developers