This is a little trick I’ve been using for a few years with Shopify when I want to build really interesting AJAX experiences in a theme.

Many people will tell you that accessing URL parameters is impossible, including top people at Shopify:

https://ecommerce.shopify.com/c/ecommerce-design/t/passing-query-parameters-17259

https://ecommerce.shopify.com/c/ecommerce-design/t/url-parameters-in-liquid-171887

However, it is possible! I’ve been using a technique to capture header information that is the same as Jason over @ [FreakDesign](https://freakdesign.com.au/) but since his code is a bit cleaner with comments, I’ve opted to use his version for this tutorial. PS, if you’ve never seen his [GitHub repo](https://github.com/freakdesign/Shopify-code-snippets), check it out, there is a treasure trove of information.

## Pros

- Create exactly the JavaScript objects you need for great AJAX experiences.
  - This allows you to build a recommendations engine for example that gets loaded AFTER initial pageload to keep your site fast.
- No need for 3rd party server to interact with Shopify APIs

## Cons

- It is invalid JSON (RFC 4627)
  - You can’t set the content type to application/json.
  - You can’t set encoding to UTF-8, UTF-16 or UTF-32.
- It is a “hack” that Shopify can remove at anytime.
  - However this has been available for years already.

## Step #1 : Create a new page template in your theme

Go into the HTML/CSS Editor and click add a new template.

Paste in this [code](https://bitbucket.org/!api/2.0/snippets/channelape/5X99L/5b8c10fd425e5d4f4e854bac50360850db578659/files/page.products-by-tag-api.liquid).

## Step #2 : Create a new page and assign it the new template

In Shopify, go to **Online Store > Pages**, create a new page, and assign it the template you created in step 1. The page handle becomes part of the URL you use to call the API.

## Step #3 : Hit that API!

Your URL will be something similar to this. Now you can replace the “test_tag” value with your tag and get all products and variants for that tag.

`/pages/test-api?tag=test_tag&cache=false`

## Why would I ever need this?

You can do something similar to what Amazon does when loading recommending product and build other unique AJAX experiences.