July 15, 2017

Host and Path in Shopify Themes

Recently I’ve been looking into some new Shopify and Liquid features that were recently announced.

One thing that caught my eye, and quietly slipped into the platform is the request object. If you are using the same theme over multiple storefronts then this might come in very handy.

Both request.host and request.path allow you to access both the domain and the full path being requested. Fair enough but why is this useful?

Often store owners will prefer a local domain for their store — this may be due to using different currencies or offering different stock. In effect everything but the theme files are different. Each theme might also require subtle differences — for example, different shipping notifications or regional offers.

While there were ways to achieve this prior to the introduction of the request object this now makes it much simpler. Here’s an example:

{% if request.host == 'myshop.co.uk' %}
Welcome UK!
{% elsif request.host == 'myshop.ca' %}
Welcome Canada!
{% else %}
Welcome!{% end %}

This simple switch means it’s not possible to include domain specific logic and only maintain one theme for use across multiple storefronts.

I haven’t come up with the perfect use case for request.path yet but potentially it could be used to do an absolute check for a particular product in a particular context — i.e.

https://stockroom.shopify.com/collections/entrepreneur-swag/products/10x-entrepreneurs-journal

as opposed to:

https://stockroom.shopify.com/products/10x-entrepreneurs-journal

You can find out more about these new features in the Shopify docs.

This article was written by Keir Whitaker and published on July 15, 2017. All articles are available in the blog archive and you can subscribe to the RSS Feed for updates. Have a question? Discuss this article with me by email.