Algolia Search
This guide will help you install and config to integration Algolia Search with Owen Hydrogen theme
Step 1: Create Algolia account and get appId, appKey information:
Step 2: Install Algolia app in Shopify Admin
You can install Algolia app for your Shopify store from this link:
https://apps.shopify.com/algolia-search
From Algolia dashboard: View information about records, configure search, request, sort, filter, ... to specify the data that can be showing on the Owen theme.
Step 3: Add ALGOLIA_APP_ID and ALGOLIA_APP_KEY to algolia.config.ts file in root folder of Owen Hydrogen theme, and change your Algolia variables (prefix, all index key):
Refer to the config below that has been applied for the Owen Algolia demo:
*Note: Because Algolia does not store the brand images, you need to upload the brand images to a Shopify media directory (or any other media storage service). Don't forget to change BRAND_IMAGE_URL variable with your brand media directory link.
The brand image file name should be not have special characters, replace each space to '-' and in .webp format.
Ex: Brand name "New Balance" -> image file name should be "new-balance.webp"
You can change the render brand image logic in: app/components/search/SearchBar.tsx
Learn more about Algolia Configuration below:
Last updated
