How to add query parameters in Shopify?

Introduction

When building a Search experience on your Shopify store, there might be times where it is necessary to add query parameters to fine tune your Search results.

A typical example of Query Parameters are filters, optionalFilters, or ruleContexts. This kind of query parameters can help you to refine your results and achieve relevance objectives.

Our Shopify plugin provides an integration for two Algolia front-end libraries:

• Autocomplete Menu
• InstantSearch

On this guide we will go through the steps to add query parameters to each integration. As an example, we will add the ruleContexts parameter. 

Adding query parameters to the Autocomplete Menu

Depending on your Autocomplete version, implementing this would be slightly different. You can find instructions for Autocomplete V0 and Autocomplete V1 below.

Autocomplete V0

In Autocomplete V0 you can add this parameter on theassets/algolia_autocomplete.js.liquid file, under the searchOpts object: 

Autocomplete V1

In Autocomplete V1 you can add this parameter on the assets/algolia_autocomplete_product_plugin.js.liquid file, under the params object: 

Adding query parameters to InstantSearch

In InstantSearch you can add this parameter on theassets/algolia_instant_search.js.liquid file, on the configure widget: