creative designer

There's no built in Liquid method to return the querystring values in a url with Shopify Liquid. There is a hacky way to get those values right now but it's far from being something I'd want to see used on a live production site - let's explore it.

The secret behind this is found within the content_for_header of a theme. Shopify adds it's own tracking and as part of that exposes the full url in html source. We can parse content_for_header and pull the url from the raw string. 

Warnings (seriously)

Shopify will cache the output of pages. If you use this querystring parsing code to show / hide content on the site you risk exposing the result to all customers. Imagine you have a discount code shown with the querystring. If Shopify caches that output version every single customer will see the code regardless of the querystring in place. The code attempts to avoid that risk by using the cache querystring value but the risk remains.

By using the cache querystring value you're no longer making use of the Shopify cache. This is what helps keep your site fast, and perform well under load. Flushing the cache isn't a great idea - especially at scale.

Also, you have no control over what content appears in content_for_header. Shopify could change the contents at any point so this code could stop working.

It's for those reasons (and mainly the first two) that I would strongly caution you against using it on a production site. It's still an interesting idea in any case.


The Example

For a quick example of how this might be used, head to my experiments site using this url. You'll see a section appear under the add to cart button when you use that url. Change the key (ref) or value (freakdesign) to anything else and watch what happens.


The Code.

grabbing the code...

You can also jump to the Shopify Snippets github repo.

Like to work with me?

Let's talk