How to Get Asset URL in Shopify

Filter function will help you save time on finding items or sources that you want. In case that you would like to use the function of locating items in a chain, you can use string filter with asset_url. The tutorial today would give you sample code to get asset url in shopify.

Table of content

What is Liquid and string filter

Website developers use Liquid as a language template for Shopify. Liquid codes is divided into three different categories including objects, tags and filters. Objects which are denoted by double curly braces are characters to display content on a page, tags which are shown by a curly brace and a percent sign illustrate logic and flow for template. Filters change the output of a Liquid object. Filter function in Liquid can be activated by using number, boolean, array, string, math and URL. Today we focus on URL filter.

URL filter produces links to assets on Shopify’s content delivery network as well as create links for filtering collections and blogs. Besides, URL filter outputs a chain of numbers, letters, flash and a question mark.

What is asset_url

URL or uniform resource locator is a reference to a web resource that specifies its location on a computer network and a mechanism for retrieving it. A URL contains the following information: the protocol used to access a resource, the location of the server, the location of the resource in the directory structure, a fragment identifier.

Asset_URL is a method to find the location of a folder. When you add asset_url in the input code, you will receive the location of that file.

Steps to get asset url in Shopify

Let’s look at the example below. Your output is an address showing where the folder comes from.

Input:


{{ 'shop.css' | asset_url }}

Output:


//cdn.shopify.com/s/files/1/0087/0462/t/394/assets/shop.css?28253

Conclusion

In a nutshell, Liquid offers you with a lot of filter function, it is important for you to choose the suitable one. Using asset_url helps you to find the origin of a folder so that you will not waste time finding this folder manually. We hope that the tutorial give you a solution for your work. Let’s us know about your difficulties and we will address them. Thank you.

Recommend for you
Image Description
Proofo - Social Proof [FREE]

Use Social proof to boost sales

Learn more
Image Description
SEO Suite [FREE]

Auto-optimize website elements and structure in one-click.

Learn more
Image Description
Size Chart [FREE]

Stunning size guide for great shopping experience

Learn more
Image Description
Free Shipping Bar [FREE]

Increase customers’ shopping cart size with free shipping offer

Learn more

Comments for Liquid asset_url: How to Get Asset URL in Shopify



Subscribe

Stay in the know

Get special offers on the latest news from AVADA.

40k subscribers has been joined!

Earn $10 in reward now!

comment
iphone
go up