How to add Search.io to your Shopify theme
Navigate to the themes section in Shopify.
![](../__attachments/719585529/image-20201207-052725.png?inst-v=51f771a3-7b8a-4cc7-b115-4a49507be006)
Edit the theme
Under “Actions” select “Edit code” to navigate to the code edit view for the theme.
![](../__attachments/719585529/image-20201207-052921.png?inst-v=51f771a3-7b8a-4cc7-b115-4a49507be006)
Under Templates, find the file called “search.liquid”. Replace the content of the file with the following code.
Replace YOUR_ACCOUNT_NUMBER
and YOUR_COLLECTION_NAME
with your search.io credentials.
Copy the content of the “search.liquid” file and keep it as a backup before you overwrite it.
<div data-widget="search-results">
<script type="application/json">
{
"account": "YOUR_ACCOUNT_NUMBER",
"collection": "YOUR_COLLECTION_NAME",
"pipeline": "query",
"preset": "shopify",
"filters": [
{
"name": "vendor",
"field": "vendor",
"title": "Vendor"
},
{
"name": "type",
"field": "product_type",
"title": "Type"
},
{
"name": "collection",
"field": "collection_titles",
"title": "Collection",
"array": true
}
]
}
</script>
<noscript>This page requires JavaScript</noscript>
</div>
<script async src="https://cdn.search.io.com/embed/1/loader.js"></script>
Preview your changes
After changing the code, preview the changes and ensure the search works and looks the way you would expect.
![](../__attachments/719585529/image-20201207-054558.png?inst-v=51f771a3-7b8a-4cc7-b115-4a49507be006)
Save your changes
If you are happy with the results, save your changes.
![](../__attachments/719585529/image-20201207-054646.png?inst-v=51f771a3-7b8a-4cc7-b115-4a49507be006)