Search by Algolia
How to increase your ecommerce conversion rate in 2024
e-commerce

How to increase your ecommerce conversion rate in 2024

2%. That’s the average conversion rate for an online store. Unless you’re performing at Amazon’s promoted products ...

Vincent Caruana

Senior Digital Marketing Manager, SEO

How does a vector database work? A quick tutorial
ai

How does a vector database work? A quick tutorial

What’s a vector database? And how different is it than a regular-old traditional relational database? If you’re ...

Catherine Dee

Search and Discovery writer

Removing outliers for A/B search tests
engineering

Removing outliers for A/B search tests

How do you measure the success of a new feature? How do you test the impact? There are different ways ...

Christopher Hawke

Senior Software Engineer

Easily integrate Algolia into native apps with FlutterFlow
engineering

Easily integrate Algolia into native apps with FlutterFlow

Algolia's advanced search capabilities pair seamlessly with iOS or Android Apps when using FlutterFlow. App development and search design ...

Chuck Meyer

Sr. Developer Relations Engineer

Algolia's search propels 1,000s of retailers to Black Friday success
e-commerce

Algolia's search propels 1,000s of retailers to Black Friday success

In the midst of the Black Friday shopping frenzy, Algolia soared to new heights, setting new records and delivering an ...

Bernadette Nixon

Chief Executive Officer and Board Member at Algolia

Generative AI’s impact on the ecommerce industry
ai

Generative AI’s impact on the ecommerce industry

When was your last online shopping trip, and how did it go? For consumers, it’s becoming arguably tougher to ...

Vincent Caruana

Senior Digital Marketing Manager, SEO

What’s the average ecommerce conversion rate and how does yours compare?
e-commerce

What’s the average ecommerce conversion rate and how does yours compare?

Have you put your blood, sweat, and tears into perfecting your online store, only to see your conversion rates stuck ...

Vincent Caruana

Senior Digital Marketing Manager, SEO

What are AI chatbots, how do they work, and how have they impacted ecommerce?
ai

What are AI chatbots, how do they work, and how have they impacted ecommerce?

“Hello, how can I help you today?”  This has to be the most tired, but nevertheless tried-and-true ...

Catherine Dee

Search and Discovery writer

Algolia named a leader in IDC MarketScape
algolia

Algolia named a leader in IDC MarketScape

We are proud to announce that Algolia was named a leader in the IDC Marketscape in the Worldwide General-Purpose ...

John Stewart

VP Corporate Marketing

Mastering the channel shift: How leading distributors provide excellent online buying experiences
e-commerce

Mastering the channel shift: How leading distributors provide excellent online buying experiences

Twice a year, B2B Online brings together America’s leading manufacturers and distributors to uncover learnings and industry trends. This ...

Jack Moberger

Director, Sales Enablement & B2B Practice Leader

Large language models (LLMs) vs generative AI: what’s the difference?
ai

Large language models (LLMs) vs generative AI: what’s the difference?

Generative AI and large language models (LLMs). These two cutting-edge AI technologies sound like totally different, incomparable things. One ...

Catherine Dee

Search and Discovery writer

What is generative AI and how does it work?
ai

What is generative AI and how does it work?

ChatGPT, Bing, Bard, YouChat, DALL-E, Jasper…chances are good you’re leveraging some version of generative artificial intelligence on ...

Catherine Dee

Search and Discovery writer

Feature Spotlight: Query Suggestions
product

Feature Spotlight: Query Suggestions

Your users are spoiled. They’re used to Google’s refined and convenient search interface, so they have high expectations ...

Jaden Baptista

Technical Writer

What does it take to build and train a large language model? An introduction
ai

What does it take to build and train a large language model? An introduction

Imagine if, as your final exam for a computer science class, you had to create a real-world large language ...

Vincent Caruana

Sr. SEO Web Digital Marketing Manager

The pros and cons of AI language models
ai

The pros and cons of AI language models

What do you think of the OpenAI ChatGPT app and AI language models? There’s lots going on: GPT-3 ...

Catherine Dee

Search and Discovery writer

How AI is transforming merchandising from reactive to proactive
e-commerce

How AI is transforming merchandising from reactive to proactive

In the fast-paced and dynamic realm of digital merchandising, being reactive to customer trends has been the norm. In ...

Lorna Rivera

Staff User Researcher

Top examples of some of the best large language models out there
ai

Top examples of some of the best large language models out there

You’re at a dinner party when the conversation takes a computer-science-y turn. Have you tried ChatGPT? What ...

Vincent Caruana

Sr. SEO Web Digital Marketing Manager

What are large language models?
ai

What are large language models?

It’s the era of Big Data, and super-sized language models are the latest stars. When it comes to ...

Catherine Dee

Search and Discovery writer

Looking for something?

facebookfacebooklinkedinlinkedintwittertwittermailmail

In this article, we’ll look into how to integrate Sanity.io with Algolia. Sanity.io is a content platform that comes with an open source headless CMS that you can customize, and a hosted real-time datastore that lets you read and update data. The philosophy behind Sanity.io is that you should be able to treat content as data and bring it to whatever product or application you have.

Now, a CMS normally doesn’t come with search functionality. It’s not easy to build even a minimal search function on top of it by yourself, let alone something that includes important features like typo tolerance and faceting. This is what our Algolia plug-in does: it adds a flexible and feature-rich search functionality on top of your CMS.

CMS<>Algolia using webhooks

There are many ways to integrate a CMS with Algolia. One of the most efficient ways is to leverage webhooks. You can create an API as a webhook endpoint and configure your CMS to trigger the webhook when content changes. In your API, you can create, update, or delete the corresponding record in your index at Algolia.

You therefore need to create an API as a webhook. If you have a web server, you can add an API there. Or if you have Sanity Studio hosted, for example, on Netlify or Vercel, you can write a serverless function as your API.

However, this part can be cumbersome. In the API, you need to check why a webhook request is triggered: creation, update, or deletion of a record. After that, you need to call the corresponding method to apply the change to Algolia. It’s not a big chunk of code, but it can be time-consuming if you don’t get the data schema right. That’s where sanity-algolia comes in and helps us deal with both sides.

A better way: sanity-algolia (with tutorial)

With sanity-algolia, you need to transform the payload for your Algolia index.

Here is how.

Install the dependencies:

npm install algoliasearch sanity-algolia

# or

yarn add algoliasearch sanity-algolia

Create the API:

import algoliasearch from 'algoliasearch';
import sanityClient from '@sanity/client';
import indexer, { flattenBlocks } from 'sanity-algolia';

const algolia = algoliasearch(...);
const sanity = sanityClient(...);

export default function handler(req, res) {
  const sanityAlgolia = indexer(
    {
      post: {
        index: algolia.initIndex('posts'),
      },
    },
    document => {
      switch (document._type) {
        case 'post':
          return {
            title: document.title,
            path: document.slug.current,
            publishedAt: document.publishedAt,
            excerpt: flattenBlocks(document.excerpt),
          };
        default:
          throw new Error(`Unknown type: ${document.type}`);
      }
    }
  );

  return sanityAlgolia
    .webhookSync(sanity, req.body)
    .then(() => res.status(200).send('ok'));
}

Let’s say the endpoint of this API is deployed at

https://my-example/api/update-algolia

Visit your Sanity dashboard to add the webhook.

Now whenever content changes in your Sanity studio, it will trigger this webhook, which will update your Algolia index with the changes.

Thanks to the library sanity-algolia, if you define which properties to fetch and how to transform them, the rest is automatically done for you.

To learn more, visit this GitHub repo.

About the author
Eunjae Lee

Recommended Articles

Powered byAlgolia Algolia Recommend

How can you improve your content management system (CMS) with great search?
product

Catherine Dee

Search and Discovery writer

What is a headless CMS (content management system)?
product

Catherine Dee

Search and Discovery writer

Choosing your APIs for Jamstack
engineering

Matthew Foyle
Sarfaraz Rydhan

Matthew Foyle &

Sarfaraz Rydhan