Home > Shopify Development > Liquid reverse Reverse Order of an Array

How to Reverse Order of an Array in Shopify

Sam Nguyen
Sam Updated: April 21, 2024

Share:

Drive 20-40% of your revenue with Avada
avada email marketing

Struggling to figure out how to reverse the order of an array in Shopify? You’re not alone. Whether you’re customizing your online store or sorting products in a specific sequence, reversing an array can be a bit tricky. In this guide, we’ll walk you through the simplest methods to reverse the order of an array in Shopify, helping you achieve the exact layout you want for your store. Say goodbye to the hassle and get your arrays sorted in no time!

Table of content

What is Liquid template language?

Liquid is used as the backbone of Shopify to upload dynamic content on the front page. Liquid has been sold since 2006 and now become a good source for a lot of hosted website application such as Jekyll, salesforce desk, and zendesk.

Liquid is a flexible and safe language and used in many different environments. Not only is it used on Shopify platform but Liquid is also used extensively on Jekyll websites. We are focusing on Liquid utilized on Shopify. Shopify always uses the lastest version of Liquid as a base, but Shopify inserts a significant number of objects, tags, and filters to Liquid for use in merchants’ stores.

What are array filter and reverse in liquid?

Array filter helps to create a new array from a provided array including names or items which meet the demand of the condition set by the argument function. In general, the formation of an array looks like this:

sample array filter

So, what is the argument function? The function of argument is to check the condition of each array. There are three arguments. First, array is mentioned above. Secind, index is processed by the function and element is processed by the curent element.

Moreover, the return value is also worth mentioning. The return value aims to return a new array consisting of elements that satisfy with the condition of argument filter.

Reverse in liquid is a function used to reverse the order of an array. The function of reverse can help to change the order so that the chain can appear on the front page in writer’s desire.

How to reverse the order

Take a look at this example, four types of fruits are listed below including apple, orange, peach and plum. If you want to alter the order, follow the code:

Input:


{% assign my_array = "apples, oranges, peaches, plums" | split: ", " %}

{{ my_array | reverse | join: ", " }}

Then the new order is appeared:

Output

plums, peaches, oranges, apples

Conclusion

Thank you for following along with our guide on how to reverse the order of an array in Shopify. Now that you’ve seen how easy it can be to adjust the sequence of your items using Liquid, it’s time to put this into action on your store. Implement these steps, and you’ll have your arrays displayed exactly how you want in no time. If you found this guide helpful, don’t forget to share it with others who might need a hand with their Shopify customization!


Sam Nguyen is the CEO and founder of Avada Commerce, an e-commerce solution provider headquartered in Singapore. He is an expert on the Shopify e-commerce platform for online stores and retail point-of-sale systems. Sam loves talking about e-commerce and he aims to help over a million online businesses grow and thrive.

Stay in the know

Get special offers on the latest news from AVADA.