# Array Filters These filters are used to manipulate arrays in Liquid templates. They allow you to combine, filter, transform, and extract data from arrays, making it easier to work with collections of items. Use these filters to clean up arrays, join or split values, find specific elements, and modify image URLs within arrays. ## compact Removes blank (false, null, '') values from the array. **Input** ```liquid {% assign my_bugs = "ants, bees, ," | split: ", " | compact %} {{ my_bugs | join: ", " }} ``` **Output** ``` ants, bees ``` --- ## concat Combines an array with another array. The resulting array will contain all the elements from both arrays. Duplicates will not be removed (that can be done with `uniq` filter). **Input** ```liquid {% assign my_bugs = "ants, bees, spiders" | split: ", " %} {% assign my_other_bugs = "wasps" | split: ", " %} {% assign all_bugs = my_bugs | concat: my_other_bugs %} {{ all_bugs | join: ", " }} ``` **Output** ``` ants, bees, spiders, wasps ``` --- ## find Returns the value of first matching key **Input** ```liquid All products: {% for product in products %} - {{ product.title }} {% endfor %} First match: {{ first_product = products | find: "type", "kitchen" }} ``` **Output** ``` All products: - Vacuum - Spatula - Television - Garlic press First match: - Spatula ``` --- ## first Returns the first element of an array. **Input** ```liquid {{ "The quick brown fox jumps over the lazy dog" | split: " " | first }} ``` **Output** ``` The ``` --- ## img_modify Modifies the image URL. Supported modifications are: width, height, quality, dpr, resize-type, format, min-width, min-height. **Input** ```liquid {{ product.image | img_modify: 'width', 200 }} {{ product.image | img_modify: 'height', 200 }} {{ product.image | img_modify: 'quality', 80 }} {{ product.image | img_modify: 'dpr', 2 }} {{ product.image | img_modify: 'resize-type', 'fit' }} {{ product.image | img_modify: 'format', 'webp' }} {{ product.image | img_modify: 'min-width', 200 }} {{ product.image | img_modify: 'min-height', 200 }} ``` **Output** ``` https://images.finqu.com/yw9wqO60K99y8VNVDipxjpT5au7ghr/some-image.jpg?w=200 https://images.finqu.com/yw9wqO60K99y8VNVDipxjpT5au7ghr/some-image.jpg?h=200 https://images.finqu.com/yw9wqO60K99y8VNVDipxjpT5au7ghr/some-image.jpg?q=80 https://images.finqu.com/yw9wqO60K99y8VNVDipxjpT5au7ghr/some-image.jpg?dpr=2 https://images.finqu.com/yw9wqO60K99y8VNVDipxjpT5au7ghr/some-image.jpg?rt=fit https://images.finqu.com/yw9wqO60K99y8VNVDipxjpT5au7ghr/some-image.jpg?ext=webp https://images.finqu.com/yw9wqO60K99y8VNVDipxjpT5au7ghr/some-image.jpg?mw=200 https://images.finqu.com/yw9wqO60K99y8VNVDipxjpT5au7ghr/some-image.jpg?mh=200 ``` --- ## join Joins elements of an array with a given character between them. **Input** ```liquid {{ "The, quick, brown, fox, jumps, over, the, lazy, dog" | split ", " | join " " }} ``` **Output** ``` The quick brown fox jumps over the lazy dog ``` --- ## lst Returns the last element of an array. **Input** ```liquid {{ "The quick brown fox jumps over the lazy dog" | split: " " | last }} ``` **Output** ``` dog ``` --- ## map Collect a given property from and array of objects **Input** ```liquid {% assign product_names = category.products | map: 'name' %} {% for name in product_names %} * {{ name }} {% endfor %} ``` **Output** ``` * Skateboard * Beenie * Jeans ``` --- ## pop Removes the last element from an array. **Input** ```liquid {% assign my_bugs = "ants, bees, spiders" | split: ", " %} {% assign last_bug = my_bugs | pop %} {{ last_bug }} ``` **Output** ``` spiders ``` --- ## push Adds an element to the end of an array. **Input** ```liquid {% assign my_bugs = "ants, bees, spiders" | split: ", " %} {% assign my_other_bugs = "wasps" | split: ", " %} {% assign all_bugs = my_bugs | push: my_other_bugs %} {{ all_bugs | join: ", " }} ``` **Output** ``` ants, bees, spiders, wasps ``` --- ## random Return a random element from the array. **Input** ```liquid {% assign my_bugs = "ants, bees, flies" | split: ", " %} {{ my_bugs | random }} {{ my_bugs | random }} {{ my_bugs | random }} ``` **Output** ``` bees flies bees ``` --- ## reverse Reverses the order of the items in an array. `reverse` cannot reverse a string. **Input** ```liquid {% assign my_array = "apples, oranges, peaches, plums" | split: ", " %} ``` **Output** ``` plums, peaches, oranges, apples ``` --- ## shift Removes the first element from an array. **Input** ```liquid {% assign my_bugs = "ants, bees, spiders" | split: ", " %} {% assign first_bug = my_bugs | shift %} {{ first_bug }} ``` **Output** ``` ants ``` --- ## size Returns the number of characters in a string or the number of items in an array. **Input** ```liquid {{ "The quick brown fox jumps over the lazy dog" | size }} {{ "The quick brown fox jumps over the lazy dog" | split: " " | size }} ``` **Output** ``` 43 9 ``` --- ## slice Returns a substring of one character or series of array items beginning at the index specified by the first argument. An optional second argument specifies the length of the substring or number of array items to be returned. **Input** ```liquid {{ "Liquid" | slice: 0 }} {{ "Liquid" | slice: 2, 5 }} {{ "The quick brown fox jumps over the lazy dog" | split: " " | slice: 1,2 | join: " " }} ``` **Output** ``` L quid quick brown ``` --- ## sort Sort the elements of an array. An optional argument specifies which property of the array’s items to use for sorting. **Input** ```liquid {% assign my_array = "zebra, octopus, giraffe, Sally Snake" | split: ", " %} {{ my_array | sort | join: ", " }} ``` **Output** ``` Sally Snake, giraffe, octopus, zebra ``` --- ## uniq Remove duplicate elements from an array. **Input** ```liquid {% assign my_array = "ants, bugs, bees, bugs, ants" | split: ", " %} {{ my_array | uniq | join: ", " }} ``` **Output** ``` ants, bugs, bees ``` --- ## unshift Adds an element to the beginning of an array. **Input** ```liquid {% assign my_bugs = "ants, bees, spiders" | split: ", " %} {% assign my_other_bugs = "wasps" | split: ", " %} {% assign all_bugs = my_bugs | unshift: my_other_bugs %} {{ all_bugs | join: ", " }} ``` **Output** ``` wasps, ants, bees, spiders ``` --- ## where Creates an array including only the objects with a given property value, or any truthy value by default. In this example, assume you have a list of products and you want to show your kitchen products separately. Using where, you can create an array containing only the products that have a "type" of "kitchen". **Input** ```liquid All products: {% for product in products %} - {{ product.title }} {% endfor %} {% assign kitchen_products = products | where: "type", "kitchen" %} Kitchen products: {% for product in kitchen_products %} - {{ product.title }} {% endfor %} ``` **Output** ``` All products: - Vacuum - Spatula - Television - Garlic press Kitchen products: - Spatula - Garlic press ```