Algolia Search
This guide will help you install and config to integration Algolia Search with Owen Hydrogen theme
Last updated
This guide will help you install and config to integration Algolia Search with Owen Hydrogen theme
Last updated
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:
