Các Bộ lọc HTML bọc các assets (Tài sản là những tập tin riêng lẻ tạo nên shop’s theme) trong các tag HTML 

img_tag

Sinh ra một tag hình ảnh.

Đầu vào

{{‘smirking_gnome.gif’|asset_url|img_tag}}

Đầu ra

<imgsrc=“//cdn.Haravan.com/s/files/1/0147/8382/t/15/assets/smirking_gnome.gif?v=1384022871″alt=“”/>

img_tag truy cập các tham số để cho ra kết quả là một tag thay thế và các tên của lớp. Tham số đầu tiên được xuất ra như một văn bản thay thế, và bất kì các tham số tiếp theo nào cũng sẽ xuất ra như một lớp CSS.

Đầu vào

{{‘smirking_gnome.gif’|asset_url|img_tag:‘Smirking Gnome’,‘cssclass1 cssclass2′}}

Đầu ra

<imgsrc=“//cdn.Haravan.com/s/files/1/0147/8382/t/15/assets/smirking_gnome.gif?v=1384022871″alt=“Smirking Gnome”class=“cssclass1 cssclass2″/>

Bộ lọc Img_tag có thể sử dụng trên những đối tượng sau đây:

product

variant

line item

collection

image

Đầu vào

{{product|img_tag}}

{{variant|img_tag:‘alternate text’}}

{{line_item|img_tag:‘alternate text’,‘css-class’}}

{{image|img_tag:‘alternate text’,‘css-class’,‘small’}}

{{collection|img_tag:‘alternate text’,‘css-class’,‘large’}}

Đầu ra 

<imgsrc=“//cdn.Haravan.com/s/files/1/0159/3350/products/red_shirt_small.jpg?v=1398706734″alt=“Red Shirt Small”/>

<imgsrc=“//cdn.Haravan.com/s/files/1/0159/3350/products/red_shirt_small.jpg?v=1398706734″alt=“alternate text”/>

<imgsrc=“//cdn.Haravan.com/s/files/1/0159/3350/products/red_shirt_small.jpg?v=1398706734″alt=“alternate text”class=“css-class”/>

<imgsrc=“//cdn.Haravan.com/s/files/1/0159/3350/products/red_shirt_small.jpg?v=1398706734″alt=“alternate text”class=“css-class”/>

<imgsrc=“//cdn.Haravan.com/s/files/1/0159/3350/products/shirts_collection_large.jpg?v=1338563745″alt=“alternate text”class=“css-class”/>

script_tag

Sinh ra một tagscript

Đầu vào

{{‘shop.js’|asset_url|script_tag}}

Đầu ra

<script src=“//cdn.Haravan.com/s/files/1/0087/0462/t/394/assets/shop.js?28178″type=“text/javascript”></script>

stylesheet_tag

Sinh ra một tag stylesheet

Đầu vào

{{‘shop.css’|asset_url|stylesheet_tag}}

 Đầu ra

<linkhref=“//cdn.Haravan.com/s/files/1/0087/0462/t/394/assets/shop.css?28178″rel=“stylesheet”type=“text/css”media=“all”/>