Metafield filters
Metafield filters can output metafield data from a metafield object within a relevant HTML element, or as a plain string.
metafield_tag
Generates an HTML element depending on the type of metafield.
The output differs depending on the metafield type:
single_line_text_field
single_line_text_field metafields output the text inside a <span> element with an attribute of class="metafield-single_line_text_field".
multi_line_text_field
multi_line_text_field metafields output the text inside a <span> element with an attribute of class="metafield-mutli_line_text_field".
page_reference
page_reference metafields output the page title of the associated page inside an <a> element with a link to the page and an attribute of class="metafield-page_reference".
product_reference
product_reference metafields output the product title of the associated product inside an <a> element with a link to the product and an attribute of class="metafield-product_reference".
variant_reference
variant_reference metafields output the variant title of the associated product inside an <a> element with a link to the variant and an attribute of class="metafield-variant_reference".
file_reference
file_reference metafields have a different output depending on the file type:
Images
Images in the format of JPEG, PNG, and GIF output an <img> element with the following attributes:
| Attribute | Value |
|---|---|
src |
[image_url] - The image's URL. |
alt |
[image_alt] - The image's alt text. |
class |
metafield-file_reference |
Other files
Other files output the file's preview image inside an <a> element with a link to the file and an attribute of class="metafield-file_reference".
number_integer
number_integer metafields output the number inside a <span> element with an attribute of class="metafield-number_integer".
number_decimal
number_decimal metafields output the number inside a <span> element with an attribute of class="metafield-number_decimal".
date
date metafields output the date, in a localized format for the customer, inside a <time> element with the following attributes:
| Attribute | Value |
|---|---|
datetime |
[date] - The date. |
class |
metafield-date |
date_time
date_time metafields output the date and time, in a localized format for the customer, inside a <time> element with the following attributes:
| Attribute | Value |
|---|---|
datetime |
[date_time] - The date and time. |
class |
metafield-date_time |
url
url metafields output the URL, with the protocol removed, inside an <a> element with a link to the URL and an attribute of class="metafield-url".
json
json metafields output the JSON inside a <script> tag with the following attributes:
| Attribute | Value |
|---|---|
type |
application/json |
class |
metafield-json |
boolean
boolean metafields output the value inside a <span> element with an attribute of class="metafield-boolean".
color
color metafields output the value inside a <span> element with an attribute of class="metafield-color".
weight
weight metafields output a <span> element, with an attribute of class="metafield-weight", that contains a <span> element for each of the following:
Weight value
The weight value is output in a <span> element with an attribute of class="metafield-weight_value".
Weight unit
The weight unit is output in a <span> element with an attribute of class="metafield-weight_unit".
volume
volume metafields output a <span> element, with an attribute of class="metafield-volume", that contains a <span> element for each of the following:
Volume value
The volume value is output in a <span> element with an attribute of class="metafield-volume-value".
Volume unit
The volume unit is output in a <span> element with an attribute of class="metafield-volume_unit":
dimension
dimension metafields output a <span> element, with an attribute of class="metafield-dimension", that contains a <span> element for each of the following:
Dimension value
The dimension value is output in a <span> element with an attribute of class="metafield-dimension_value".
Dimension unit
The dimension unit is output in a <span> element with an attribute of class="metafield-dimension_unit":
rating
rating metafields output the rating value in a <span> element with an attribute of class="metafield-rating":
metafield_text
Generates a text version of the metafield data.
The following outlines the output for each metafield type:
| Metafield Type | Output |
|---|---|
single_line_text_field |
The metafield text |
multi_line_text_field |
The metafield text |
page_reference |
The page title |
product_reference |
The product title |
variant_reference |
The variant title |
file_reference |
The file URL |
number_integer |
The number |
number_decimal |
The number |
date |
The date |
date_time |
The date and time |
url |
The URL |
json |
The JSON |
boolean |
The boolean value |
color |
The color value |
weight |
The weight value and unit |
volume |
The volume value and unit |
dimension |
The dimension value and unit |
rating |
The rating value |