How to Create a Collection-aware product URL in Shopify
Drive 20-40% of your revenue with Avada
Would you like to create better customer journey? Would you like to sell more products? Liquid in Shopify provides you a filter that helps you to generate a collection of related items. The tutorial today focuses on steps to create a collection-aware product URL in Shopify.
Table of content
What is Liquid
As you know, Liquid is classified into three subcategories consisting of objects, filters and tags. Liquid use objects to show the location of content on a page. Double curly braces denote objects and variable names. Filters change a Liquid object’s output. Tags create logic and control flow for a template. Tags begin with two curly braces and percent signs. Tags can be divided into three types: control flow, iteration and variable assignment.
Of all types of filters in Liquid, the url link of the product collection can help you show items in one collection for your clients.
What is a Collection-aware product URL
A collection-aware product URL is created by prepending /collections/collection-handle to a product URL. The product URL is a place where collection-handle is the handle of the collection that is currently being viewed.
Let’s move to the next part to see how to create a collection-aware product URL.
How to create a collection-aware product URL
Take a look at the example below.
Input
<a href="{{ product.url | within: collection }}">{{ product.title }}</a>
Output
<a href="/collections/frontpage/products/alien-poster">Alien Poster</a>
Attention: when a product belongs to collection-aware, its product template can access the collection output. Therefore, you can add in collection-related content, such as related-product.
Conclusion
To sum up, collection-aware product URL is useful in adding lists of related items in your front page. Liquid helps you to do anything by inserting your url product link. We hope that the tutorial is helpful and let us know your problems, we will address them.
Liquid
