How to escape URL including parameters in Shopify

Liquid becomes familiar with Shopify users who usually upload content on the platform. Liquid, as you know, offers users with a lot of filter function, in which url_param_escape should be considered. URL parameter is an effective tool for you to activate the string filter in Liquid. The tutorial today will focus the code to escape url including parameters.

Table of content

Overview about Liquid and string filter

Liquid has been launched since 2006, until now it is used on a lot of digital platforms including Shopify and Jekyll. It includes many logical and comparison operators. Basic operators are often used in Liquid code so that you can change or separate items in order to show what you want.

Liquid is classified into three types: objects, tags and filters. Objects show the content on a page. Tags create logic and control flow for templates while filters change the output of variables.

Liquid offers five types: string, number, boolean, nil and array. Number includes floats and integers. Boolean response to true or false value. Nil is a special empty value that is returned when Liquid code has no results. Today, string filter is our focus.

String filters are used to manipulate outputs and variables of string types.

Information about url and url parameters

A uniform resource locator (URL) is the address of a resource on the Internet. A URL indicates the location of a resource as well as the protocol used to access it. It contains information such as: the protocol used to access a resource, the location of the server, the location of the resource in the directory structure, a fragment identifier.

URL_param_escape filter replaces all characters not allowed in URLs with URL-encoded equivalents, including the ampersand character. If you want to leave the ampersand character unchanged, you should use the URL_escape filter.

Sample of escaping url_param_escape

If url_escape does not change letters and ampersand character in a chain, url_param_escape just keep letters the same. Take a look at the example below.

Input:


{{ "<hello> & <shopify>" | url_param_escape }}

Output:


%3Chello%3E%20%26%20%3Cshopify%3E

Conclusion

To sum up, this simple tutorial assists you in filtering characters without changing letters in a chain in Liquid. By using url_param_escape filter, you produce output with a chain of letter and percent signs. We hope that you will have flexible method to do your work on Shopify platform. Let us know your difficulties and we will address them.