Liquid filters are used to modify Liquid output.
Many filters accept parameters that let you specify how the filter should be applied. Some filters might require parameters to be valid.
Multiple filters can be used on one output. They're applied from left to right.
To apply filters to an output, add the filter and any filter parameters within the output's curly brace delimiters {{ }}, preceded by a pipe character |. In the example below, product is the object, title is its property, and upcase is the filter being applied.
Array filters modify [arrays](/docs/api/liquid/basics#array).
Deprecated: false
array | compact
Removes any `nil` items from an array.
code:
{%- assign original_prices = collection.products | map: 'compare_at_price' -%}
Original prices:
{% for price in original_prices -%}
- {{ price }}
{%- endfor %}
{%- assign compacted_original_prices = original_prices | compact -%}
Original prices - compacted:
{% for price in compacted_original_prices -%}
- {{ price }}
{%- endfor %}
data:
{"collection":{"products":[{"compare_at_price":null},{"compare_at_price":null},{"compare_at_price":null},{"compare_at_price":null},{"compare_at_price":"1000000.59"},{"compare_at_price":null},{"compare_at_price":null},{"compare_at_price":null},{"compare_at_price":"10.00"},{"compare_at_price":null},{"compare_at_price":"25.00"},{"compare_at_price":"400.00"},{"compare_at_price":null},{"compare_at_price":null},{"compare_at_price":null},{"compare_at_price":null},{"compare_at_price":null},{"compare_at_price":null},{"compare_at_price":null}]}}
output:
Original prices:
-
-
-
-
- 100000059
-
-
-
- 1000
-
- 2500
- 40000
-
-
-
-
-
-
-
Original prices - compacted:
- 100000059
- 1000
- 2500
- 40000
Deprecated: false
array | concat: array
Concatenates (combines) two arrays.
code:
{%- assign types_and_vendors = collection.all_types | concat: collection.all_vendors -%}
Types and vendors:
{% for item in types_and_vendors -%}
{%- if item != blank -%}
- {{ item }}
{%- endif -%}
{%- endfor %}
data:
{"collection":{"all_types":["","Animals & Pet Supplies","Baking Flavors & Extracts","Container","Cooking & Baking Ingredients","Dried Flowers","Fruits & Vegetables","Gift Cards","Health","Health & Beauty","Invisibility","Love","Music & Sound Recordings","Seasonings & Spices","Water"],"all_vendors":["Clover's Apothecary","Polina's Potent Potions","Ted's Apothecary Supply"]}}
output:
Types and vendors:
- Animals & Pet Supplies
- Baking Flavors & Extracts
- Container
- Cooking & Baking Ingredients
- Dried Flowers
- Fruits & Vegetables
- Gift Cards
- Health
- Health & Beauty
- Invisibility
- Love
- Music & Sound Recordings
- Seasonings & Spices
- Water
- Clover's Apothecary
- Polina's Potent Potions
- Ted's Apothecary Supply
Deprecated: false
array | first
Returns the first item in an array.
code:
{%- assign first_product = collection.products | first -%}
{{ first_product.title }}
data:
{"collection":{"products":[{"title":"Blue Mountain Flower"},{"title":"Charcoal"},{"title":"Crocodile tears"},{"title":"Dandelion milk"},{"title":"Draught of Immortality"},{"title":"Dried chamomile"},{"title":"Forest mushroom"},{"title":"Gift Card"},{"title":"Glacier ice"},{"title":"Ground mandrake root"},{"title":"Health potion"},{"title":"Invisibility potion"},{"title":"Komodo dragon scale"},{"title":"Love Potion"},{"title":"Mana potion"},{"title":"Potion beats"},{"title":"Potion bottle"},{"title":"Viper venom"},{"title":"Whole bloodroot"}]}}
output:
Blue Mountain Flower
code:
{{ collection.products.first.title }}
data:
{"collection":{"products":[{"title":"Blue Mountain Flower"},{"title":"Charcoal"},{"title":"Crocodile tears"},{"title":"Dandelion milk"},{"title":"Draught of Immortality"},{"title":"Dried chamomile"},{"title":"Forest mushroom"},{"title":"Gift Card"},{"title":"Glacier ice"},{"title":"Ground mandrake root"},{"title":"Health potion"},{"title":"Invisibility potion"},{"title":"Komodo dragon scale"},{"title":"Love Potion"},{"title":"Mana potion"},{"title":"Potion beats"},{"title":"Potion bottle"},{"title":"Viper venom"},{"title":"Whole bloodroot"}]}}
output:
Blue Mountain Flower
Deprecated: false
array | join
Combines all of the items in an array into a single string, separated by a space.
code:
{{ collection.all_tags | join }}
data:
{"collection":{"all_tags":["extra-potent","fresh","healing","ingredients"]}}
output:
extra-potent fresh healing ingredients
code:
{{ collection.all_tags | join: ', ' }}
data:
{"collection":{"all_tags":["extra-potent","fresh","healing","ingredients"]}}
output:
extra-potent, fresh, healing, ingredients
Deprecated: false
array | last
Returns the last item in an array.
code:
{%- assign last_product = collection.products | last -%}
{{ last_product.title }}
data:
{"collection":{"products":[{"title":"Blue Mountain Flower"},{"title":"Charcoal"},{"title":"Crocodile tears"},{"title":"Dandelion milk"},{"title":"Draught of Immortality"},{"title":"Dried chamomile"},{"title":"Forest mushroom"},{"title":"Gift Card"},{"title":"Glacier ice"},{"title":"Ground mandrake root"},{"title":"Health potion"},{"title":"Invisibility potion"},{"title":"Komodo dragon scale"},{"title":"Love Potion"},{"title":"Mana potion"},{"title":"Potion beats"},{"title":"Potion bottle"},{"title":"Viper venom"},{"title":"Whole bloodroot"}]}}
output:
Whole bloodroot
code:
{{ collection.products.last.title }}
data:
{"collection":{"products":[{"title":"Blue Mountain Flower"},{"title":"Charcoal"},{"title":"Crocodile tears"},{"title":"Dandelion milk"},{"title":"Draught of Immortality"},{"title":"Dried chamomile"},{"title":"Forest mushroom"},{"title":"Gift Card"},{"title":"Glacier ice"},{"title":"Ground mandrake root"},{"title":"Health potion"},{"title":"Invisibility potion"},{"title":"Komodo dragon scale"},{"title":"Love Potion"},{"title":"Mana potion"},{"title":"Potion beats"},{"title":"Potion bottle"},{"title":"Viper venom"},{"title":"Whole bloodroot"}]}}
output:
Whole bloodroot
Deprecated: false
array | map: string
Creates an array of values from a specific property of the items in an array.
code:
{%- assign product_titles = collection.products | map: 'title' -%}
{{ product_titles | join: ', ' }}
data:
{"collection":{"products":[{"title":"Draught of Immortality"},{"title":"Glacier ice"},{"title":"Health potion"},{"title":"Invisibility potion"}]}}
output:
Draught of Immortality, Glacier ice, Health potion, Invisibility potion
Deprecated: false
array | reverse
Reverses the order of the items in an array.
code:
Original order:
{{ collection.products | map: 'title' | join: ', ' }}
Reverse order:
{{ collection.products | reverse | map: 'title' | join: ', ' }}
data:
{"collection":{"products":[{"title":"Draught of Immortality"},{"title":"Glacier ice"},{"title":"Health potion"},{"title":"Invisibility potion"}]}}
output:
Original order:
Draught of Immortality, Glacier ice, Health potion, Invisibility potion
Reverse order:
Invisibility potion, Health potion, Glacier ice, Draught of Immortality
code:
{{ collection.title | split: '' | reverse | join: '' }}
data:
{"collection":{"title":"Sale potions"}}
output:
snoitop elaS
Deprecated: false
variable | size
Returns the size of a string or array.
code:
{{ collection.title | size }}
{{ collection.products | size }}
data:
{}
output:
12
4
code:
{% if collection.products.size >= 10 %}
There are 10 or more products in this collection.
{% else %}
There are less than 10 products in this collection.
{% endif %}
data:
{}
output:
There are less than 10 products in this collection.
Deprecated: false
array | sort
Sorts the items in an array in case-sensitive alphabetical, or numerical, order.
code:
{% assign tags = collection.all_tags | sort %}
{% for tag in tags -%}
{{ tag }}
{%- endfor %}
data:
{"collection":{"all_tags":["Burning","dried","extra-potent","extracts","fresh","healing","ingredients","music","plant","Salty","supplies"]}}
output:
Burning
Salty
dried
extra-potent
extracts
fresh
healing
ingredients
music
plant
supplies
code:
{% assign products = collection.products | sort: 'price' %}
{% for product in products -%}
{{ product.title }}
{%- endfor %}
data:
{"collection":{"products":[{"price":"10.00","title":"Blue Mountain Flower"},{"price":"0.00","title":"Charcoal"},{"price":"56.00","title":"Crocodile tears"},{"price":"0.00","title":"Dandelion milk"},{"price":"1000000.00","title":"Draught of Immortality"},{"price":"8.98","title":"Dried chamomile"},{"price":"0.00","title":"Forest mushroom"},{"price":"10.00","title":"Gift Card"},{"price":"0.00","title":"Glacier ice"},{"price":"0.00","title":"Ground mandrake root"},{"price":"10.00","title":"Health potion"},{"price":"250.00","title":"Invisibility potion"},{"price":"0.00","title":"Komodo dragon scale"},{"price":"0.00","title":"Love Potion"},{"price":"10.00","title":"Mana potion"},{"price":"0.00","title":"Potion beats"},{"price":"0.00","title":"Potion bottle"},{"price":"400.00","title":"Viper venom"},{"price":"24.99","title":"Whole bloodroot"}]}}
output:
Charcoal
Dandelion milk
Forest mushroom
Glacier ice
Ground mandrake root
Komodo dragon scale
Love Potion
Potion beats
Potion bottle
Dried chamomile
Blue Mountain Flower
Gift Card
Health potion
Mana potion
Whole bloodroot
Crocodile tears
Invisibility potion
Viper venom
Draught of Immortality
Deprecated: false
array | sort_natural
Sorts the items in an array in case-insensitive alphabetical order.
code:
{% assign tags = collection.all_tags | sort_natural %}
{% for tag in tags -%}
{{ tag }}
{%- endfor %}
data:
{"collection":{"all_tags":["Burning","dried","extra-potent","extracts","fresh","healing","ingredients","music","plant","Salty","supplies"]}}
output:
Burning
dried
extra-potent
extracts
fresh
healing
ingredients
music
plant
Salty
supplies
code:
{% assign products = collection.products | sort_natural: 'title' %}
{% for product in products -%}
{{ product.title }}
{%- endfor %}
data:
{"collection":{"products":[{"title":"Blue Mountain Flower"},{"title":"Charcoal"},{"title":"Crocodile tears"},{"title":"Dandelion milk"},{"title":"Draught of Immortality"},{"title":"Dried chamomile"},{"title":"Forest mushroom"},{"title":"Gift Card"},{"title":"Glacier ice"},{"title":"Ground mandrake root"},{"title":"Health potion"},{"title":"Invisibility potion"},{"title":"Komodo dragon scale"},{"title":"Love Potion"},{"title":"Mana potion"},{"title":"Potion beats"},{"title":"Potion bottle"},{"title":"Viper venom"},{"title":"Whole bloodroot"}]}}
output:
Blue Mountain Flower
Charcoal
Crocodile tears
Dandelion milk
Draught of Immortality
Dried chamomile
Forest mushroom
Gift Card
Glacier ice
Ground mandrake root
Health potion
Invisibility potion
Komodo dragon scale
Love Potion
Mana potion
Potion beats
Potion bottle
Viper venom
Whole bloodroot
Deprecated: false
array | sum
Returns the sum of all elements in an array.
code:
{% assign fibonacci = '0, 1, 1, 2, 3, 5' | split: ', ' %}
{{ fibonacci | sum }}
data:
{}
output:
12
code:
Total quantity of all items in cart:
{{ cart.items | sum: 'quantity' }}
Subtotal price for all items in cart:
{{ cart.items | sum: 'final_line_price' | money }}
data:
{"cart":{"items":[{"final_line_price":"22.49","quantity":1},{"final_line_price":"400.00","quantity":1}]}}
output:
Total quantity of all items in cart:
2
Subtotal price for all items in cart:
$422.49
Deprecated: false
array | uniq
Removes any duplicate items in an array.
code:
{% assign potion_array = 'invisibility, health, love, health, invisibility' | split: ', ' %}
{{ potion_array | uniq | join: ', ' }}
data:
{}
output:
invisibility, health, love
Deprecated: false
array | where: string, string
Filters an array to include only items with a specific property value.
code:
{% assign polina_products = collection.products | where: 'vendor', "Polina's Potent Potions" %}
Products from Polina's Potent Potions:
{% for product in polina_products -%}
- {{ product.title }}
{%- endfor %}
data:
{"collection":{"products":[{"title":"Blue Mountain Flower","vendor":"Polina's Potent Potions"},{"title":"Charcoal","vendor":"Ted's Apothecary Supply"},{"title":"Crocodile tears","vendor":"Polina's Potent Potions"},{"title":"Dandelion milk","vendor":"Clover's Apothecary"},{"title":"Draught of Immortality","vendor":"Polina's Potent Potions"},{"title":"Dried chamomile","vendor":"Clover's Apothecary"},{"title":"Forest mushroom","vendor":"Clover's Apothecary"},{"title":"Gift Card","vendor":"Polina's Potent Potions"},{"title":"Glacier ice","vendor":"Ted's Apothecary Supply"},{"title":"Ground mandrake root","vendor":"Clover's Apothecary"},{"title":"Health potion","vendor":"Polina's Potent Potions"},{"title":"Invisibility potion","vendor":"Polina's Potent Potions"},{"title":"Komodo dragon scale","vendor":"Ted's Apothecary Supply"},{"title":"Love Potion","vendor":"Polina's Potent Potions"},{"title":"Mana potion","vendor":"Polina's Potent Potions"},{"title":"Potion beats","vendor":"Polina's Potent Potions"},{"title":"Potion bottle","vendor":"Polina's Potent Potions"},{"title":"Viper venom","vendor":"Ted's Apothecary Supply"},{"title":"Whole bloodroot","vendor":"Clover's Apothecary"}]}}
output:
Products from Polina's Potent Potions:
- Blue Mountain Flower
- Crocodile tears
- Draught of Immortality
- Gift Card
- Health potion
- Invisibility potion
- Love Potion
- Mana potion
- Potion beats
- Potion bottle
code:
{% assign available_products = collection.products | where: 'available' %}
Available products:
{% for product in available_products -%}
- {{ product.title }}
{%- endfor %}
data:
{"collection":{"products":[{"available":false,"title":"Blue Mountain Flower"},{"available":true,"title":"Charcoal"},{"available":false,"title":"Crocodile tears"},{"available":false,"title":"Dandelion milk"},{"available":true,"title":"Draught of Immortality"},{"available":true,"title":"Dried chamomile"},{"available":false,"title":"Forest mushroom"},{"available":true,"title":"Gift Card"},{"available":false,"title":"Glacier ice"},{"available":true,"title":"Ground mandrake root"},{"available":true,"title":"Health potion"},{"available":true,"title":"Invisibility potion"},{"available":false,"title":"Komodo dragon scale"},{"available":false,"title":"Love Potion"},{"available":true,"title":"Mana potion"},{"available":true,"title":"Potion beats"},{"available":false,"title":"Potion bottle"},{"available":true,"title":"Viper venom"},{"available":true,"title":"Whole bloodroot"}]}}
output:
Available products:
- Charcoal
- Draught of Immortality
- Dried chamomile
- Gift Card
- Ground mandrake root
- Health potion
- Invisibility potion
- Mana potion
- Potion beats
- Viper venom
- Whole bloodroot
Cart filters output or modify content specific to the [`cart` object](/docs/api/liquid/objects/cart) and its properties.
Deprecated: false
cart | item_count_for_variant: {variant_id}
Returns the total item count for a specified variant in the cart.
code:
{{ cart | item_count_for_variant: 39888235757633 }}
data:
{}
output:
1
Deprecated: false
cart | line_items_for: object
Returns the subset of cart line items that include a specified product or variant.
code:
{% assign product = all_products['bloodroot-whole'] %}
{% assign line_items = cart | line_items_for: product %}
Total cart quantity for product: {{ line_items | sum: 'quantity' }}
data:
{"all_products":{"bloodroot-whole":{}}}
output:
Total cart quantity for product: 1
code:
{% assign product = all_products['bloodroot-whole'] %}
{% assign variant = product.variants.first %}
{% assign line_items = cart | line_items_for: variant %}
Total cart quantity for variant: {{ line_items | sum: 'quantity' }}
data:
{"all_products":{"bloodroot-whole":{"variants":[]}},"product":{"variants":[]}}
output:
Total cart quantity for variant: 1
Collection filters output or modify content specific to the [`collection` object](/docs/api/liquid/objects/collection) and its properties.
Deprecated: false
string | highlight_active_tag
Wraps a given tag in an HTML `<span>` tag, with a `class` attribute of `active`, if the tag is currently active. Only applies to collection tags.
code:
{% for tag in collection.all_tags %}
{{- tag | highlight_active_tag | link_to_tag: tag }}
{% endfor %}
data:
{"collection":{"all_tags":["extra-potent","fresh","healing","ingredients"]},"template":"collection"}
output:
<a href="/services/liquid_rendering/extra-potent" title="Show products matching tag extra-potent"><span class="active">extra-potent</span></a>
<a href="/services/liquid_rendering/fresh" title="Show products matching tag fresh">fresh</a>
<a href="/services/liquid_rendering/healing" title="Show products matching tag healing">healing</a>
<a href="/services/liquid_rendering/ingredients" title="Show products matching tag ingredients">ingredients</a>
Deprecated: false
string | link_to_type
Generates an HTML `<a>` tag with an `href` attribute linking to a collection page that lists all products of the given product type.
code:
{{ 'Health' | link_to_type }}
data:
{}
output:
<a href="/collections/types?q=Health" title="Health">Health</a>
code:
{{ 'Health' | link_to_type: class: 'link-class' }}
data:
{}
output:
<a class="link-class" href="/collections/types?q=Health" title="Health">Health</a>
Deprecated: false
string | link_to_vendor
Generates an HTML `<a>` tag with an `href` attribute linking to a collection page that lists all products of a given product vendor.
code:
{{ "Polina's Potent Potions" | link_to_vendor }}
data:
{}
output:
<a href="/collections/vendors?q=Polina%27s%20Potent%20Potions" title="Polina&#39;s Potent Potions">Polina's Potent Potions</a>
code:
{{ "Polina's Potent Potions" | link_to_vendor: class: 'link-class' }}
data:
{}
output:
<a class="link-class" href="/collections/vendors?q=Polina%27s%20Potent%20Potions" title="Polina&#39;s Potent Potions">Polina's Potent Potions</a>
Deprecated: false
string | sort_by: string
Generates a collection URL with the provided `sort_by` parameter appended. This filter must be applied to a collection URL.
code:
{{ collection.url | sort_by: 'best-selling' }}
data:
{"collection":{"url":"/collections/sale-potions"}}
output:
/collections/sale-potions?sort_by=best-selling
Deprecated: false
string | url_for_type
Generates a URL for a collection page that lists all products of the given product type.
code:
{{ 'health' | url_for_type }}
data:
{}
output:
/collections/types?q=health
Deprecated: false
string | url_for_vendor
Generates a URL for a collection page that lists all products from the given product vendor.
code:
{{ "Polina's Potent Potions" | url_for_vendor }}
data:
{}
output:
/collections/vendors?q=Polina%27s%20Potent%20Potions
Deprecated: false
string | within: collection
Generates a product URL within the context of the provided collection.
code:
{%- assign collection_product = collection.products.first -%}
{{ collection_product.url | within: collection }}
data:
{"collection":{"products":[{"url":"/products/draught-of-immortality"},{"url":"/products/glacier-ice"},{"url":"/products/health-potion"},{"url":"/products/invisibility-potion"}]}}
output:
/collections/sale-potions/products/draught-of-immortality
Color filters modify or extract properties from CSS color strings. These filters are commonly used with [color theme settings](/themes/architecture/settings/input-settings#color). To learn how to access theme settings, refer to [Settings](/themes/architecture/settings#access-settings).
Deprecated: false
string | brightness_difference: string
Calculates the [perceived brightness difference](https://www.w3.org/WAI/ER/WD-AERT/#color-contrast) between two colors.
code:
{{ '#E800B0' | brightness_difference: '#FECEE9' }}
data:
{}
output:
134
Deprecated: false
string | color_brightness
Calculates the [perceived brightness](https://www.w3.org/WAI/ER/WD-AERT/#color-contrast) of a given color.
code:
{{ '#EA5AB9' | color_brightness }}
data:
{}
output:
143.89
Deprecated: false
string | color_contrast: string
Calculates the contrast ratio between two colors and returns the ratio's numerator. The ratio's denominator, which isn't returned, is always 1. For example, with a contrast ratio of 3.5:1, this filter returns 3.5.
code:
{{ '#E800B0' | color_contrast: '#D9D8FF' }}
data:
{}
output:
3.0
Deprecated: false
string | color_darken: number
Darkens a given color by a specific percentage. The percentage must be between 0 and 100.
code:
{{ '#EA5AB9' | color_darken: 30 }}
data:
{}
output:
#98136b
Deprecated: false
string | color_desaturate: number
Desaturates a given color by a specific percentage. The percentage must be between 0 and 100.
code:
{{ '#EA5AB9' | color_desaturate: 30 }}
data:
{}
output:
#ce76b0
Deprecated: false
string | color_difference: string
Calculates the [color difference](https://www.w3.org/WAI/ER/WD-AERT/#color-contrast) between two colors.
code:
{{ '#720955' | color_difference: '#FFF3F9' }}
data:
{}
output:
539
Deprecated: false
string | color_extract: string
Extracts a specific color component from a given color.
code:
{{ '#EA5AB9' | color_extract: 'red' }}
data:
{}
output:
234
Deprecated: false
string | color_lighten: number
Lightens a given color by a specific percentage. The percentage must be between 0 and 100.
code:
{{ '#EA5AB9' | color_lighten: 30 }}
data:
{}
output:
#fbe2f3
Deprecated: false
string | color_mix: string, number
Blends two colors together by a specific percentage factor. The percentage must be between 0 and 100.
code:
{{ '#E800B0' | color_mix: '#00936F', 50 }}
data:
{}
output:
#744a90
code:
{{ 'rgba(232, 0, 176, 0.75)' | color_mix: '#00936F', 50 }}
data:
{}
output:
rgba(116, 74, 144, 0.88)
Deprecated: false
string | color_modify: string, number
Modifies a specific color component of a given color by a specific amount.
code:
{{ '#EA5AB9' | color_modify: 'red', 255 }}
data:
{}
output:
#ff5ab9
code:
{{ '#EA5AB9' | color_modify: 'alpha', 0.85 }}
data:
{}
output:
rgba(234, 90, 185, 0.85)
Deprecated: false
string | color_saturate: number
Saturates a given color by a specific percentage. The percentage must be between 0 and 100.
code:
{{ '#EA5AB9' | color_saturate: 30 }}
data:
{}
output:
#ff45c0
Deprecated: false
string | color_to_hex
Converts a CSS color string to hexadecimal format (`hex6`).
code:
{{ 'rgb(234, 90, 185)' | color_to_hex }}
data:
{}
output:
#ea5ab9
Deprecated: false
string | color_to_hsl
Converts a CSS color string to `HSL` format.
code:
{{ '#EA5AB9' | color_to_hsl }}
data:
{}
output:
hsl(320, 77%, 64%)
Deprecated: false
string | color_to_rgb
Converts a CSS color string to `RGB` format.
code:
{{ '#EA5AB9' | color_to_rgb }}
data:
{}
output:
rgb(234, 90, 185)
Deprecated: true
string | hex_to_rgba
Converts a CSS color string from hexadecimal format to `RGBA` format. Shorthand hexadecimal formatting (`hex3`) is also accepted.
code:
{{ '#EA5AB9' | hex_to_rgba }}
data:
{}
output:
rgba(234,90,185,1)
code:
{{ '#EA5AB9' | hex_to_rgba: 0.5 }}
data:
{}
output:
rgba(234,90,185,0.5)
Customer filters output URLs that enable customers to interact with their account in the store.
Deprecated: false
customer | avatar
Generates HTML to render a customer's avatar, if available.
Deprecated: false
string | customer_login_link
Generates an HTML link to the customer login page.
code:
{{ 'Log in' | customer_login_link }}
data:
{}
output:
<a href="/account/login" id="customer_login_link">Log in</a>
Deprecated: false
string | customer_logout_link
Generates an HTML link to log the customer out of their account and redirect to the homepage.
code:
{{ 'Log out' | customer_logout_link }}
data:
{}
output:
<a href="/account/logout" id="customer_logout_link">Log out</a>
Deprecated: false
string | customer_register_link
Generates an HTML link to the customer registration page.
code:
{{ 'Create an account' | customer_register_link }}
data:
{}
output:
<a href="/account/register" id="customer_register_link">Create an account</a>
Deprecated: false
shop | login_button
Generates an HTML Button that enables a customer to either sign in to the storefront using their Shop account or follow the shop in the Shop App.
code:
data:
output:
code:
data:
output:
Default filters enable you to use or set default values for certain contexts.
Deprecated: false
variable | default: variable
Sets a default value for any variable whose value is one of the following: - [`empty`](/docs/api/liquid/basics#empty) - [`false`](/docs/api/liquid/basics#truthy-and-falsy) - [`nil`](/docs/api/liquid/basics#nil)
code:
{{ product.selected_variant.url | default: product.url }}
data:
{"product":{"selected_variant":null,"url":"/products/health-potion"}}
output:
/products/health-potion
code:
{%- assign display_price = false -%}
{{ display_price | default: true, allow_false: true }}
data:
{}
output:
false
Deprecated: false
string | default_errors
Generates default error messages for each possible value of [`form.errors`](/docs/themes/liquid/reference/objects/form#form-errors).
Deprecated: false
paginate | default_pagination
Generates HTML for a set of links for paginated results. Must be applied to the [`paginate` object](/docs/api/liquid/objects/paginate).
code:
{% paginate collection.products by 2 %}
{% for product in collection.products %}
{{- product.title }}
{% endfor %}
{{- paginate | default_pagination -}}
{% endpaginate %}
data:
{"collection":{"products":[{"title":"Draught of Immortality"},{"title":"Glacier ice"}],"products_count":4}}
output:
Draught of Immortality
Glacier ice
<span class="page current">1</span> <span class="page"><a href="/services/liquid_rendering/resource?page=2" title="">2</a></span> <span class="next"><a href="/services/liquid_rendering/resource?page=2" title="">Next &raquo;</a></span>
Font filters modify [`font` objects](/docs/api/liquid/objects/font), which are defined in font [theme settings](/themes/architecture/settings/input-settings#font). You can use font filters to load fonts or to obtain font variants. To learn how to access theme settings, refer to [Settings](/themes/architecture/settings#access-settings). Refer to [Shopify's font library](/themes/architecture/settings/fonts#available-fonts) for a list of all fonts and their variants.
Deprecated: false
font | font_face
Generates a CSS [`@font_face` declaration](https://developer.mozilla.org/en-US/docs/Web/CSS/%40font-face) to load the provided font.
code:
{{ settings.type_header_font | font_face }}
data:
{}
output:
@font-face {
font-family: Assistant;
font-weight: 400;
font-style: normal;
src: url("//polinas-potent-potions.myshopify.com/cdn/fonts/assistant/assistant_n4.bcd3d09dcb631dec5544b8fb7b154ff234a44630.woff2?h1=cG9saW5hcy1wb3RlbnQtcG90aW9ucy5hY2NvdW50Lm15c2hvcGlmeS5jb20&hmac=f3e05b75609b5d3c9d16b8463b6fc76562a875978049062ab557891e578db7c2") format("woff2"),
url("//polinas-potent-potions.myshopify.com/cdn/fonts/assistant/assistant_n4.a2d012304becc2a26f1ded1acc136fcab85c9afd.woff?h1=cG9saW5hcy1wb3RlbnQtcG90aW9ucy5hY2NvdW50Lm15c2hvcGlmeS5jb20&hmac=6d44b2914ff99881162bdebc7eb9807dfa8d152792a77fe369d544274565575a") format("woff");
}
code:
{{ settings.type_header_font | font_face: font_display: 'swap' }}
data:
{}
output:
@font-face {
font-family: Assistant;
font-weight: 400;
font-style: normal;
font-display: swap;
src: url("//polinas-potent-potions.myshopify.com/cdn/fonts/assistant/assistant_n4.bcd3d09dcb631dec5544b8fb7b154ff234a44630.woff2?h1=cG9saW5hcy1wb3RlbnQtcG90aW9ucy5hY2NvdW50Lm15c2hvcGlmeS5jb20&hmac=f3e05b75609b5d3c9d16b8463b6fc76562a875978049062ab557891e578db7c2") format("woff2"),
url("//polinas-potent-potions.myshopify.com/cdn/fonts/assistant/assistant_n4.a2d012304becc2a26f1ded1acc136fcab85c9afd.woff?h1=cG9saW5hcy1wb3RlbnQtcG90aW9ucy5hY2NvdW50Lm15c2hvcGlmeS5jb20&hmac=6d44b2914ff99881162bdebc7eb9807dfa8d152792a77fe369d544274565575a") format("woff");
}
Deprecated: false
font | font_modify: string, string
Modifies a specific property of a given font.
code:
{%- assign bold_font = settings.type_body_font | font_modify: 'weight', 'bold' -%}
h2 {
font-weight: {{ bold_font.weight }};
}
data:
{}
output:
h2 {
font-weight: 700;
}
code:
{%- assign bold_font = settings.type_body_font | font_modify: 'weight', 'bold' -%}
{%- assign italic_font = settings.type_body_font | font_modify: 'style', 'italic' -%}
{%- assign heavy_font = settings.type_body_font | font_modify: 'weight', '900' | default: bold_font -%}
{%- assign oblique_font = settings.type_body_font | font_modify: 'style', 'oblique' | default: italic_font -%}
h2 {
font-style: {{ heavy_font.weight }};
}
.italic {
{% if oblique_font -%}
font-style: {{ oblique_font.style }};
{%- else -%}
font-style: {{ italic_font.style }};
{%- endif %}
}
data:
{}
output:
h2 {
font-style: 700;
}
.italic {
font-style: ;
}
Deprecated: false
font | font_url
Returns the [CDN URL](/themes/best-practices/performance/platform#shopify-cdn) for the provided font in `woff2` format.
code:
{{ settings.type_header_font | font_url }}
data:
{}
output:
//polinas-potent-potions.myshopify.com/cdn/fonts/assistant/assistant_n4.bcd3d09dcb631dec5544b8fb7b154ff234a44630.woff2?h1=cG9saW5hcy1wb3RlbnQtcG90aW9ucy5hY2NvdW50Lm15c2hvcGlmeS5jb20&hmac=f3e05b75609b5d3c9d16b8463b6fc76562a875978049062ab557891e578db7c2
code:
{{ settings.type_header_font | font_url: 'woff' }}
data:
{}
output:
//polinas-potent-potions.myshopify.com/cdn/fonts/assistant/assistant_n4.a2d012304becc2a26f1ded1acc136fcab85c9afd.woff?h1=cG9saW5hcy1wb3RlbnQtcG90aW9ucy5hY2NvdW50Lm15c2hvcGlmeS5jb20&hmac=6d44b2914ff99881162bdebc7eb9807dfa8d152792a77fe369d544274565575a
Format filters apply formats to specific data types.
Deprecated: false
string | date: string
Converts a timestamp into another date format.
code:
{{ article.created_at | date: '%B %d, %Y' }}
data:
{"article":{"created_at":"2022-04-14 16:56:02 -0400"}}
output:
April 14, 2022
code:
{{ 'now' | date: '%B %d, %Y' }}
data:
{}
output:
December 23, 2024
code:
{{ article.created_at | date: format: 'abbreviated_date' }}
data:
{"article":{"created_at":"2022-04-14 16:56:02 -0400"}}
output:
Apr 14, 2022
code:
{{ article.created_at | date: format: 'month_day_year' }}
data:
{"article":{"created_at":"2022-04-14 16:56:02 -0400"}}
output:
April 14, 2022
Deprecated: false
variable | json
Converts a string, or object, into JSON format.
code:
{{ product | json }}
data:
{}
output:
{"id":6792602320961,"title":"Crocodile tears","handle":"crocodile-tears","description":"","published_at":"2022-04-22T11:55:58-04:00","created_at":"2022-04-22T11:55:56-04:00","vendor":"Polina's Potent Potions","type":"","tags":["Salty"],"price":5600,"price_min":5600,"price_max":5600,"available":false,"price_varies":false,"compare_at_price":null,"compare_at_price_min":0,"compare_at_price_max":0,"compare_at_price_varies":false,"variants":[{"id":39888242344001,"title":"Default Title","option1":"Default Title","option2":null,"option3":null,"sku":"","requires_shipping":true,"taxable":true,"featured_image":null,"available":false,"name":"Crocodile tears","public_title":null,"options":["Default Title"],"price":5600,"weight":0,"compare_at_price":null,"inventory_management":"shopify","barcode":"","requires_selling_plan":false,"selling_plan_allocations":[],"quantity_rule":{"min":1,"max":null,"increment":1}}],"images":["\/\/polinas-potent-potions.myshopify.com\/cdn\/shop\/products\/amber-beard-oil-bottle.jpg?v=1650642958"],"featured_image":"\/\/polinas-potent-potions.myshopify.com\/cdn\/shop\/products\/amber-beard-oil-bottle.jpg?v=1650642958","options":["Title"],"media":[{"alt":null,"id":21772501975105,"position":1,"preview_image":{"aspect_ratio":1.5,"height":2974,"width":4460,"src":"\/\/polinas-potent-potions.myshopify.com\/cdn\/shop\/products\/amber-beard-oil-bottle.jpg?v=1650642958"},"aspect_ratio":1.5,"height":2974,"media_type":"image","src":"\/\/polinas-potent-potions.myshopify.com\/cdn\/shop\/products\/amber-beard-oil-bottle.jpg?v=1650642958","width":4460}],"requires_selling_plan":false,"selling_plan_groups":[],"content":""}
Deprecated: false
variable | structured_data
Converts an object into a schema.org structured data format.
code:
<script type="application/ld+json">
{{ product | structured_data }}
</script>
data:
{}
output:
<script type="application/ld+json">
{"@context":"http:\/\/schema.org\/","@id":"\/products\/crocodile-tears#product","@type":"Product","brand":{"@type":"Brand","name":"Polina's Potent Potions"},"category":"","description":"","image":"https:\/\/polinas-potent-potions.myshopify.com\/cdn\/shop\/products\/amber-beard-oil-bottle.jpg?v=1650642958\u0026width=1920","name":"Crocodile tears","offers":{"@id":"\/products\/crocodile-tears?variant=39888242344001#offer","@type":"Offer","availability":"http:\/\/schema.org\/OutOfStock","price":"56.00","priceCurrency":"CAD","url":"https:\/\/polinas-potent-potions.myshopify.com\/products\/crocodile-tears?variant=39888242344001"},"url":"https:\/\/polinas-potent-potions.myshopify.com\/products\/crocodile-tears"}
</script>
Deprecated: false
number | weight_with_unit
Generates a formatted weight for a [`variant` object](/docs/api/liquid/objects/variant#variant-weight). The weight unit is set in the [general settings](https://www.shopify.com/admin/settings/general) in the Shopify admin.
code:
{%- assign variant = product.variants.first -%}
{{ variant.weight | weight_with_unit }}
data:
{"product":{"variants":[{"weight":200},{"weight":200},{"weight":400},{"weight":200}]}}
output:
0.2 kg
code:
{%- assign variant = product.variants.first -%}
{{ variant.weight | weight_with_unit: variant.weight_unit }}
data:
{"product":{"variants":[{"weight":200,"weight_unit":"g"},{"weight":200,"weight_unit":"g"},{"weight":400,"weight_unit":"g"},{"weight":200,"weight_unit":"g"}]}}
output:
200 g
Hosted file filters return URLs for assets hosted on the [Shopify CDN](/themes/best-practices/performance/platform#shopify-cdn), including files [uploaded in the Shopify admin](https://help.shopify.com/manual/shopify-admin/productivity-tools/file-uploads).
Deprecated: false
string | asset_img_url
Returns the [CDN URL](/themes/best-practices/performance/platform#shopify-cdn) for an image in the [`assets` directory](/themes/architecture#assets) of a theme.
code:
{{ 'red-and-black-bramble-berries.jpg' | asset_img_url }}
data:
{}
output:
//polinas-potent-potions.myshopify.com/cdn/shop/t/4/assets/red-and-black-bramble-berries_small.jpg?322
code:
{{ 'red-and-black-bramble-berries.jpg' | asset_img_url: 'large' }}
data:
{}
output:
//polinas-potent-potions.myshopify.com/cdn/shop/t/4/assets/red-and-black-bramble-berries_large.jpg?322
Deprecated: false
string | asset_url
Returns the [CDN URL](/themes/best-practices/performance/platform#shopify-cdn) for a file in the [`assets` directory](/themes/architecture#assets) of a theme.
code:
{{ 'cart.js' | asset_url }}
data:
{}
output:
//polinas-potent-potions.myshopify.com/cdn/shop/t/4/assets/cart.js?v=83971781268232213281663872410
Deprecated: false
string | file_img_url
Returns the [CDN URL](/themes/best-practices/performance/platform#shopify-cdn) for an image from the [Files](https://www.shopify.com/admin/settings/files) page of the Shopify admin.
code:
{{ 'potions-header.png' | file_img_url }}
data:
{}
output:
//polinas-potent-potions.myshopify.com/cdn/shop/files/potions-header_small.png?v=4246568442683817558
code:
{{ 'potions-header.png' | file_img_url: 'large' }}
data:
{}
output:
//polinas-potent-potions.myshopify.com/cdn/shop/files/potions-header_large.png?v=4246568442683817558
Deprecated: false
string | file_url
Returns the [CDN URL](/themes/best-practices/performance/platform#shopify-cdn) for a file from the [Files](https://www.shopify.com/admin/settings/files) page of the Shopify admin.
code:
{{ 'disclaimer.pdf' | file_url }}
data:
{}
output:
//polinas-potent-potions.myshopify.com/cdn/shop/files/disclaimer.pdf?v=9043651738044769859
Deprecated: false
string | global_asset_url
Returns the [CDN URL](/themes/best-practices/performance/platform#shopify-cdn) for a global asset.
code:
{{ 'lightbox.js' | global_asset_url | script_tag }}
{{ 'lightbox.css' | global_asset_url | stylesheet_tag }}
data:
{}
output:
<script src="//polinas-potent-potions.myshopify.com/cdn/s/global/lightbox.js" type="text/javascript"></script>
<link href="//polinas-potent-potions.myshopify.com/cdn/s/global/lightbox.css" rel="stylesheet" type="text/css" media="all" />
Deprecated: false
string | shopify_asset_url
Returns the [CDN URL](/themes/best-practices/performance/platform#shopify-cdn) for a globally accessible Shopify asset.
code:
{{ 'option_selection.js' | shopify_asset_url }}
data:
{}
output:
//polinas-potent-potions.myshopify.com/cdn/shopifycloud/shopify/assets/themes_support/option_selection-86cdd286ddf3be7e25d68b9fc5965d7798a3ff6228ff79af67b3f4e41d6a34be.js
HTML filters create HTML elements based on Liquid properties or a store’s assets.
Deprecated: false
settings.layout | class_list
Generates the list of style classes for a [style setting](/storefronts/themes/architecture/settings/style-settings) or a collection of settings.
code:
{{ settings.layout | class_list }}
data:
{"settings":{"layout":{}}}
output:
styles:layout:flex styles:settings:layout
Deprecated: false
string | highlight: string
Wraps all instances of a specific string, within a given string, with an HTML `<strong>` tag with a `class` attribute of `highlight`.
code:
{% for item in search.results %}
{% if item.object_type == 'product' %}
{{ item.description | highlight: search.terms }}
{% else %}
{{ item.content | highlight: search.terms }}
{% endif %}
{% endfor %}
data:
{"search":{"results":[{"description":"This is a love potion.","object_type":"product"}],"terms":"love"}}
output:
This is a <strong class="highlight">love</strong> potion.
Deprecated: false
asset_name | inline_asset_content
Outputs the content of an asset inline in the template. The asset must be either a SVG, JS, or CSS file.
code:
{{ 'icon.svg' | inline_asset_content }}
data:
{}
output:
'<svg xmlns="http://www.w3.org/2000/svg"/>'
Deprecated: false
string | link_to: string
Generates an HTML `<a>` tag.
code:
{{ 'Shopify' | link_to: 'https://www.shopify.com' }}
data:
{}
output:
<a href="https://www.shopify.com" title="" rel="nofollow">Shopify</a>
code:
{{ 'Shopify' | link_to: 'https://www.shopify.com', class: 'link-class' }}
data:
{}
output:
<a class="link-class" href="https://www.shopify.com" rel="nofollow">Shopify</a>
Deprecated: false
string | placeholder_svg_tag
Generates an HTML `<svg>` tag for a given placeholder name.
code:
{{ 'collection-1' | placeholder_svg_tag }}
data:
{}
output:
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 525.5 525.5"><path d="M439.9 310.8c-.2.2-.1.5.1.7l13.2 8.7c.1.1.2.1.3.1.2 0 .3-.1.4-.2.2-.2.1-.5-.1-.7l-13.2-8.7c-.3-.2-.6-.1-.7.1z"/><path d="M463.4 235c1.1-9.4-1-18.6-5.1-21.6-1.7-1.2-3.6-1.3-5.4-.3l-.3.3-6.1-9.8-.1-.1-.8-8.1c-.2-1.9-1.7-3.3-3.6-3.3h-33c-1.6-33-14-75.8-44-75.9h-.1c-7.8 0-14.9 3.1-21.1 9.3-12.5 12.5-21 38.1-22.3 66.5h-20.7v-2.5c0-1.5-1.2-2.7-2.7-2.7h-3.8c-1.5 0-2.7 1.2-2.7 2.7v2.5H288c-1.9 0-3.4 1.4-3.6 3.3l-.8 8.4-5.9 9.5c-.1-.1-.3-.3-.5-.3-.8-.2-2.2-.3-3.6.8-.4.3-.7.6-1.1 1.1-8.5 9.5-6.5 32.6-.8 51.2h-34.5c.1-2.1.2-4.6.4-7.3.6-10.3 1.3-23.1.1-30.3-1.7-10.1-8.9-21.5-13.3-26.6-3.9-4.5-9.3-10.8-11.1-12.9 6.2-4 9.6-9.6 10.1-16.6v-.6c.3-3-.4-7.1-2.8-9.7-1.5-1.7-3.4-2.5-5.7-2.5h-39.6c-.3-11.5-6.3-23-19.3-23-4.3 0-8.2 1.7-11.4 4.5l-.2-.1c0 .1-.1.2-.1.4-4.5 4.2-7.4 10.8-7.6 18.3h-34.9c-2.3 0-4.3.8-5.7 2.5-2.3 2.6-3.1 6.7-2.8 9.7v.6c.5 7 3.9 12.6 10.1 16.6-1.9 2.2-7.3 8.4-11.1 12.9-5.4 6.3-11.9 17.3-13.3 26.6-2 12.9-.8 23 .2 32 .9 7.8 1.7 14.6.3 21.6-.8 1.7-1.7 3.6-2.4 5.6-3.2 8.4-4.4 18.9-3.6 23.5.7 3.9 4.3 6.7 8.9 8.3H62.8c-.6 0-1 .4-1 1V389c0 .6.4 1 1 1h59.7c.2.4.4.8.5 1.2 1.1 2.4 2.2 5 3.5 8.2.1.2.2.5.3.7 2.3 5.2 7.5 8.8 13.5 8.8h171.3c6 0 11.2-3.6 13.5-8.8v-.1l.3-.6c1.3-3.2 2.5-5.9 3.5-8.3.2-.4.4-.8.5-1.2H442c.9 0 1.7-.5 2.1-1.3.4-.8.3-1.7-.2-2.4l-8.4-10.8c-3-3.8-7.4-6-12.3-6h-53v-30.5c0-.3-.1-.5-.3-.7 6.3-.4 13.3-1.6 21-4 7.8-2.4 14.7-5.7 20.9-9.5H452c1.7 0 3.4-.7 4.5-2s1.7-3 1.5-4.7l-4.2-42.4c0-.1-.1-.3-.1-.4 5.8-13.2 9.3-27.2 9.7-40.5.1.4.1.3 0 .3zm-9.4-20.2c1.1-.6 2.2-.6 3.2.2 1.9 1.4 3.5 5 4.2 9.7-1.5-1.6-3.8-2-5.7-2.3l-1.5-.3c-1.4-.3-2.2-1-2.5-2.1-.3-1 0-2.2.7-3.3l1 1.6c.2.3.5.5.8.5.2 0 .4 0 .5-.2.5-.3.6-.9.3-1.4l-1.4-2.2c.2-.1.3-.1.4-.2zm-2.8 0c-1.5 1.7-2 3.8-1.5 5.7.5 1.8 1.9 3 4 3.5.5.1 1.1.2 1.6.3 3.1.6 5.1 1.1 5.5 3.8.1.5.5.8.9.8.1 3-.2 6.4-.9 9.8-1.9 8.8-4.6 17.3-8.2 25.5l-5.7-56.1 4.3 6.7zm-50.1-7.5h8.3l3.1 27.6c.1.5-.1.9-.4 1.2-.3.3-.7.5-1.2.5h-11.4c-.5 0-.9-.2-1.2-.5s-.4-.8-.4-1.2l3.2-27.6zm10.2-.4l-.1-.7c-.1-.5-.5-.9-1-.9h-10.1c-.5 0-.9.4-1 .9l-.1.7v-7.7h2.3v.6c0 1.3 1.1 2.4 2.4 2.4h3.2c1.3 0 2.4-1.1 2.4-2.4v-.6h2v7.7zm-49.2-14.7V140c1 .3 2 .5 3.1.5s2.1-.2 3.1-.5v52.2h-6.2zm-32.6 0c1.2-26.6 8.8-50.1 19.9-61.3 2.6-2.6 5.4-4.5 8.4-5.7-1.3 1.6-2.1 3.6-2.1 5.9 0 3.4 1.8 6.3 4.5 8 0 .1-.1.2-.1.4v52.7h-30.6zm-8.2 15.2h8.3l3.1 27.6c.1.5-.1.9-.4 1.2s-.7.5-1.2.5h-11.4c-.5 0-.9-.2-1.2-.5s-.4-.8-.4-1.2l3.2-27.6zm10.2-.4l-.1-.7c-.1-.5-.5-.9-1-.9h-10.1c-.5 0-.9.4-1 .9l-.1.7v-7.7h2.1v.5c0 1.3 1.1 2.4 2.4 2.4h3c1.3 0 2.4-1.1 2.4-2.4v-.6h2.3v7.8zm33.6-83.2c.6 0 1.2 0 1.7.1 3.3.8 5.8 3.7 5.8 7.2 0 4.1-3.3 7.4-7.4 7.4s-7.4-3.3-7.4-7.4c0-3.5 2.4-6.4 5.7-7.2.5-.1 1-.1 1.6-.1zm5 15.3c2.7-1.7 4.4-4.6 4.4-8 0-2.3-.8-4.3-2.1-6 17.4 6.6 27.3 36.7 28.7 67.1h-31v-52.7c.1-.2.1-.3 0-.4zm-24.8-12c5.8-5.8 12.5-8.8 19.7-8.8h.1c31 .1 42.2 48.8 42.2 81.5 0 .2-.2.4-.4.4h-3.2c-.2 0-.4-.2-.4-.4 0-2.1 0-4.1-.1-6.2.1-.1.1-.3.1-.5s-.1-.4-.2-.5c-1.5-34.5-14-68.8-36.1-70.8-.6-.1-1.3-.2-2-.2s-1.4.1-2 .2c-5.5.5-10.6 3.1-15.2 7.6-12.6 12.5-20.7 40.1-20.7 70.3 0 .2-.2.4-.4.4h-3c-.2 0-.4-.2-.4-.4.1-30.8 8.7-59.3 22-72.6zM299 208h-5.3l1.7-13.5h1.8L299 208zm-5.4-16v-2.3c0-.4.3-.7.7-.7h3.8c.4 0 .7.3.7.7v2.5h-5.4c.2-.1.2-.1.2-.2zm-7.1 3.7c.1-.8.8-1.5 1.6-1.5h5.3l-1.9 14.7c0 .3.1.6.2.8.2.2.5.3.8.3h7.6c.3 0 .6-.1.8-.3.2-.2.3-.5.2-.8l-1.9-14.7h22.3c0 1-.1 2-.1 3.1h-3.1c-.6 0-1 .4-1 1v11.8c0 .6.4 1 1 1 .2 0 .4-.1.6-.2l-2.7 23.9c-.1 1 .2 2 .9 2.8.7.8 1.6 1.2 2.7 1.2h11.4c1 0 2-.4 2.7-1.2.7-.8 1-1.8.9-2.8l-2.7-23.9c.2.1.3.2.6.2.6 0 1-.4 1-1v-11.8c0-.6-.4-1-1-1H329.4c0-1 0-2.1.1-3.1h71.9c0 1 .1 2 .1 3h-3.3c-.6 0-1 .4-1 1V210c0 .6.4 1 1 1 .2 0 .4-.1.6-.2l-2.7 23.9c-.1 1 .2 2 .9 2.8.7.8 1.6 1.2 2.7 1.2h11.4c1 0 2-.4 2.7-1.2.7-.8 1-1.8.9-2.8l-2.7-23.9c.2.1.3.2.6.2.6 0 1-.4 1-1v-11.8c0-.6-.4-1-1-1h-3c0-1 0-2-.1-3.1h32.9c.8 0 1.5.6 1.6 1.5l7.3 72.1c-11.7 24.7-30.6 45-52.5 55.3h-66.3c0-.4-.1-.9-.1-1.3-.5-4.8-.9-9.5-1.3-14.1h81.6c.3 0 .5-.2.5-.5s-.2-.5-.5-.5H331c-.6-7.5-1.1-14.8-1.1-22v-15.1c0-1.8-1.5-3.3-3.3-3.3h-22.2v-5.7c0-.6-.4-1-1-1h-17.2c-.6 0-1 .4-1 1v5.7h-5.5l6.8-70.5zm75.6 134.2V325h6.1v5.1c-2.1.1-4.1 0-6.1-.2zm-18.6-4.9h16.6v4.6c-5.7-.7-11.3-2.2-16.6-4.6zm26.7 0h23.6c-7.9 3.1-15.8 4.8-23.6 5.1V325zm-10.1 44.6h-25.3c.1-1.2.1-2.5.1-3.8v-6.2c1.1-1.1 2.1-2.3 3.1-3.6.2-.2.2-.5.2-.8l-1.8-11.2c-.1-.4-.4-.7-.8-.8-.4-.1-.8.1-1 .5-.1.2-.3.5-.4.7-.4-5-.8-9.9-1.2-14.8 5.8 3.7 14.8 7.8 27.3 8.8 0 .1-.1.2-.1.3v30.9zm-81.5 6.8h.7v9.6h-.7v-9.6zm-2 16.3h-10.9v-16.3h4.5v8.9c0 .6.4 1 1 1s1-.4 1-1v-8.9h4.5v16.3zm-101.2 1h10.9v8.7l-5.5 4.4-5.5-4.4v-8.7zm-2-7.8h-.7v-9.6h.7v9.6zm2 1v-10.6h4.5v8.9c0 .6.4 1 1 1s1-.4 1-1v-8.9h4.5v15.3h-10.9v-4.7zm0-30.7h10.9v18.2h-4.5v-1c0-.6-.4-1-1-1s-1 .4-1 1v1h-4.5v-18.2zm12.9 20.2h.7v9.6h-.7v-9.6zm-.4 27.3c.2-.2.4-.5.4-.8v-9.2h1.3c.6 0 1-.4 1-1s-.4-1-1-1h-1.3v-3.8h1.7c.6 0 1-.4 1-1v-11.6c0-.6-.4-1-1-1h-1.7v-4.1c.2.2.4.3.7.3h74.4c.1 0 .2 0 .3-.1v3.8H262c-.6 0-1 .4-1 1v11.6c0 .6.4 1 1 1h1.7v4.8h-1.3c-.6 0-1 .4-1 1s.4 1 1 1h1.3v8.2c0 .3.1.6.4.8l4.3 3.4h-84.8l4.3-3.3zm75.8-17.8h-.7v-9.6h.7v9.6zm2 16.6v-7.7h10.9v7.7l-5.5 4.4-5.4-4.4zm6.5-28.1v-1c0-.6-.4-1-1-1s-1 .4-1 1v1h-4.5v-18.2h10.9v18.2h-4.4zm6.4-18.2h2.8c.6 0 1-.4 1-1s-.4-1-1-1h-20.6c-.6 0-1 .4-1 1s.4 1 1 1h2.8v12.5c-.1 0-.2-.1-.3-.1H189c-.3 0-.6.1-.7.3v-12.8h2.8c.6 0 1-.4 1-1s-.4-1-1-1h-20.6c-.6 0-1 .4-1 1s.4 1 1 1h2.8v12.6c-.1-.1-.3-.1-.5-.1h-37.2c-6.2 0-11.2-5-11.2-11.2v-88c0-.7.6-1.3 1.3-1.3h51.7c2 3.3 6.8 9.6 17.9 17.6l-1.1 1.4c-.2.2-.2.5-.2.7 0 .3.2.5.4.7l4 3.1-.6.8c-.3.4-.3 1.1.2 1.4.2.1.4.2.6.2.3 0 .6-.1.8-.4l.6-.8 4 3.1c.2.1.4.2.6.2.3 0 .6-.1.8-.4l1.1-1.4 4.7 3.6c-.1.1-.2.1-.3.2-.8 1.1-1.2 2.5-1 3.8.2 1.4.9 2.6 2 3.5l48.7 37.3c.9.7 2 1.1 3.2 1.1h.7c1.4-.2 2.6-.9 3.5-2 .2-.2.2-.5.2-.7 21.9 14.6 38.4 24.9 51.4 24.9 1.5 0 3-.2 4.5-.5-2.1 1.9-4.8 3-7.6 3h-37.7v-12.3zM152.6 197v5h-6.5v-5h6.5zm-6.5 6h6.5v3.2h-6.5V203zm7.5 5.2c.6 0 1-.4 1-1V197h6.2v10.2c0 .6.4 1 1 1h2.9c.2 10.1 1.1 18.1 3 24.4h-18.9c1.7-7.8 2.6-16.3 2.2-24.4h2.6zm9.2-2V203h6.5v3.2h-6.5zm6.6-4.2h-6.5v-5h6.5v5zm-1 32.6c.5 1.6 1.1 3 1.8 4.3.2.3.5.6.9.6.2 0 .3 0 .4-.1.5-.2.7-.8.4-1.3-.5-1-1-2.2-1.4-3.4H208v8.6h-25.4c-.3 0-.5.2-.5.5s.2.5.5.5H208v4h-27.1c-.7-.3-3.4-2.6-4.2-3.5-.4-.4-1-.5-1.4-.1-.4.4-.5 1-.1 1.4.4.4 1.3 1.3 2.4 2.2h-34c.6-1.3 1.2-2.6 1.7-4h19.4c.3 0 .5-.2.5-.5s-.2-.5-.5-.5h-19c1-2.7 1.9-5.6 2.6-8.6h20.1zm30.6 25.5h-4.6l1.5-9.5h1.6l1.5 9.5zm-55.4-17h-34.9v-8.6h37.6c-.8 3.1-1.7 6-2.7 8.6zm-34.9 1h34.5c-.6 1.4-1.2 2.8-1.8 4h-32.7v-4zm4.3 6.1h27.3c-.7 1.3-1.5 2.5-2.3 3.6-.3.4-.2 1.1.2 1.4.2.1.4.2.6.2.3 0 .6-.1.8-.4 1-1.4 2-3 2.9-4.8h51.3l-1.7 10.8c0 .3 0 .6.2.8.2.2.5.4.8.4h6.9c.3 0 .6-.1.8-.4.2-.2.3-.5.2-.8l-1.7-10.8h4.8v16h-11.9c-2.5-2.7-3.6-4.5-3.7-4.6-.2-.4-.7-.6-1.1-.4l-10.7 3.1c-.3.1-.5.2-.6.5-.1.2-.2.5-.1.8l.2.6h-8.8v-5.7c0-.6-.4-1-1-1h-17.2c-.6 0-1 .4-1 1v5.7h-22.6c-1.8 0-3.3 1.5-3.3 3.3v15.1c0 5.5-.3 11-.7 16.6h-2.7c-5.4-.4-6.1-2.8-6.1-4.9v-46.1zm207.4 18v85.3c-11.3.5-26.1-9.9-43.2-21.8-.3-.2-.6-.4-.9-.7 1.7-2.3 1.3-5.5-1-7.3l-48.6-37.3c-1.1-.8-2.5-1.2-3.9-1-1.4.2-2.6.9-3.5 2 0 0-.1.1-.1.2l-4.7-3.6 1-1.3c.2-.2.2-.5.2-.7 0-.3-.2-.5-.4-.7l-4-3.1.6-.8c.3-.4.3-1.1-.2-1.4-.4-.3-1.1-.3-1.4.2l-.6.8-4-3.1c-.4-.3-1.1-.3-1.4.2l-1.1 1.4c-3.8-2.5-6.8-5-9-7.2h126.2zm-18.3-2h-15.2v-4.7h15.2v4.7zm25.5 85c-1.4.9-3 1.5-4.6 1.9-.5.1-1 .2-1.6.2v-85.2h4.8c.7 0 1.3.6 1.3 1.3v81.7c0 .1.1.1.1.1zm2.5-29.3c.8 8.1 1.6 16.5 2.2 25.1-.9 1.1-1.8 2-2.7 2.8v-33.2c.1 1.8.3 3.5.5 5.3zm-68.2 15.2c1.7 1.1 3.3 2.2 4.9 3.3-.2.1-.4.2-.5.3-.5.7-1.3 1.1-2.1 1.2-.8.1-1.7-.1-2.4-.6l-2.2-1.7c.2 0 .5-.1.6-.4l1.7-2.1zm-3.3 1c-.2.2-.2.5-.2.7l-7.8-6c.2 0 .5-.1.6-.4l2.4-3.1 6.9-9 2.7-3.5 7.4 5.7-12 15.6zm-80.1-72.2l8.9-2.6c1.3 1.9 5.7 7.7 14.7 13.6l-5.6 7.3c-12.6-9.1-16.8-15.9-18-18.3zm18.4 21.1l3.2 2.5-.5.6-3.2-2.5.5-.6zm4.8 3.7l3.2 2.5-.5.6-3.2-2.5.5-.6zm-3.6-5.3l5.6-7.3 8.1 6.2-5.6 7.3-8.1-6.2zm14.9-2.7l-3.2-2.5.4-.5 3.2 2.5-.4.5zm-4.8-3.7l-3.2-2.5.4-.5 3.2 2.5-.4.5zm5.2 6.5l10.3 7.9-5.7 7.4-10.3-7.9 5.7-7.4zm11.5 6.3l-4.1-3.2.1-.1c.5-.7 1.3-1.1 2.1-1.2.9-.1 1.7.1 2.4.6l1.6 1.2-2.1 2.7zm-12.4 7.7c.1-.1.1-.2.2-.3l4.1 3.2-2.2 2.8-1.5-1.2c-.7-.5-1.1-1.3-1.2-2.1s.1-1.7.6-2.4zm13.4-5.7l2.7-3.5 7.4 5.7-9.6 12.5-2.8 3.6-7.4-5.7 9.7-12.6zm26.7 33.5l-24-18.4 5.7-7.4 24 18.4-5.7 7.4zm6.9-9l-24-18.4 2.1-2.7 24 18.4-2.1 2.7zm-32.1-7.8l24 18.4-1.7 2.3c-.2.2-.2.5-.2.7l-24.2-18.6 2.1-2.8zm44.7 13.3l2 1.5c1.4 1.1 1.7 3.1.6 4.5v.1c-1.5-1.1-3.1-2.2-4.7-3.3l2.1-2.8zm-121.7-57.6v-4.7h15.2v4.7h-15.2zm112.7 69.3l5.7-7.4c2.5 1.7 4.9 3.4 7.3 5.1 19.5 13.7 34.9 24.4 47.3 21.8 4.1-.9 7.6-3.2 10.6-7l.3-.3c.2-.3.4-.5.6-.8l1.3 8.2c-15 19.2-35.7 5.5-73.1-19.6zm15.1-77.8c-5-7.8-7.1-17.4-7.3-25.5.2.4.5.6.9.6.1 0 .2 0 .4-.1.5-.2.8-.8.6-1.3-.8-2 1.6-4.1 4.1-6.4 2.4-2.2 4.8-4.4 4.7-6.9-.1-1.3-.8-2.5-2.2-3.6l3.8-6.1-5 49.3zm-1.5-42.8l-1.4 2.2c-.3.5-.1 1.1.3 1.4.2.1.3.2.5.2.3 0 .7-.2.8-.5l1.3-2.1c.8.7 1.2 1.3 1.2 2 .1 1.6-2 3.5-4.1 5.3-1.8 1.6-3.8 3.4-4.5 5.4.2-5.4 1.3-9.8 2.9-12.2.1-.2.2-.3.3-.5.3-.3.5-.6.8-.8.7-.4 1.3-.5 1.9-.4zm-7.7 17.7c0 1 .1 2 .2 3.1.8 9.6 4 18.5 8.8 25.1l-.5 5.4H274c-3.6-11.1-5.6-23.5-5-33.6zm-46.1-29.3c4.3 5 11.2 15.9 12.8 25.6 1.2 7 .4 20.2-.1 29.9-.2 2.7-.3 5.2-.4 7.3h-29v-16h2.8c.6 0 1-.4 1-1v-15.6c0-.6-.4-1-1-1h-39.2c-1.9-6.1-2.9-14.3-3.1-24.4h3.6c.6 0 1-.4 1-1V197h2.8c16.7 0 29.1-2.3 37.4-6.9 1.7 1.9 7.4 8.5 11.4 13.2zm-10-40.3c1.7 1.8 2.2 4.8 1.9 6.8v.5c-1 12.7-15.2 19.1-42.4 19.1h-28.1c-27.1 0-41.4-6.4-42.4-19.1v-.5c-.2-2.1.3-5 1.9-6.8.5-.6 1.1-1 1.8-1.3H211c.7.3 1.3.7 1.9 1.3zm-39.6-3.3h-6c.7-2.7 2.1-9.2 1.2-15.2 3.3 4.1 4.7 9.8 4.8 15.2zm-7.5-18c2.3 6.5.1 15.6-.6 18h-18.4c-.6-2.3-2.7-10.7-.8-17.2 2.8-2.5 6.2-3.9 10-3.9 4.1-.1 7.3 1.1 9.8 3.1zm-22.4 3.6c-.7 5.8.7 11.8 1.3 14.4h-6c.2-5.7 1.9-10.7 4.7-14.4zm-48.1 27c0-.2 0-.5-.1-.7-.2-2.5.4-6.1 2.3-8.2 1.1-1.2 2.5-1.8 4.3-1.8h2c-.2.2-.5.4-.7.6-1.9 2.1-2.4 5.3-2.2 7.6v.5c1 13.3 15.6 20 43.4 20h28.1c27.7 0 42.3-6.7 43.4-20v-.5c.2-2.3-.3-5.6-2.2-7.6-.2-.2-.4-.4-.7-.6h2c1.7 0 3.2.6 4.3 1.8 1.9 2.1 2.5 5.7 2.3 8.2 0 .2 0 .4-.1.7-1.1 15-17 22.7-47.3 22.7h-31.6c-30.2 0-46.1-7.6-47.2-22.7zm-14.1 88.1c-1-8.8-2.2-18.9-.2-31.5 1.5-9.5 8.5-20.6 12.8-25.6 4-4.7 9.7-11.3 11.4-13.2 8.2 4.6 20.7 6.9 37.4 6.9h1.6v10.2c0 .6.4 1 1 1h3.8c.4 8.1-.5 16.6-2.2 24.4h-39c-.6 0-1 .4-1 1v15.6c0 .6.4 1 1 1h3.3v37H79.5c3-7.4 6.8-12.6 6.9-12.7.3-.4.2-1.1-.2-1.4-.4-.3-1.1-.2-1.4.2-.1.1-1.1 1.6-2.5 3.9.3-5.4-.4-10.8-1.1-16.8zM75.4 311c-.7-4.1.4-14 3.3-21.8H111v7.1c0 4.2 2.7 6.5 8 6.9h2.7c-.4 5.4-.9 10.9-1.5 16.5H94.6c-12.1-.1-18.4-4.6-19.2-8.7zm-11.6 77.1v-66.5H120c-1.4 14.1-2.9 28.7-2.8 44.1 0 10.7 1.8 16 4.5 22.3H63.8zm55.3-22.3c0-15.3 1.4-29.8 2.8-43.9.2-1.8.3-3.5.5-5.2v40.8c0 3.2 1.2 6.2 3.1 8.5v26.2c-.2-.5-.5-1.1-.7-1.6-3.5-8-5.6-12.8-5.7-24.8zm9.5 33.7c-.1-.2-.2-.5-.3-.7-.5-1.4-.8-2.9-.8-4.5v-26.5c2.2 1.8 5.1 2.8 8.1 2.8h37.2c.2 0 .3-.1.5-.1v3.9h-1.7c-.6 0-1 .4-1 1V387c0 .6.4 1 1 1h1.7v3.8H172c-.6 0-1 .4-1 1s.4 1 1 1h1.3v9.2c0 .3.1.6.4.8l4.3 3.4h-37.7c-5.2-.1-9.7-3.2-11.7-7.7zm183 7.6H274l4.3-3.4c.2-.2.4-.5.4-.8v-8.2h1.3c.6 0 1-.4 1-1s-.4-1-1-1h-1.3v-4.8h1.7c.6 0 1-.4 1-1v-11.6c0-.6-.4-1-1-1h-1.7v-3.7h37.7c3 0 5.8-1 8.1-2.8v26.5c0 1.6-.3 3.1-.8 4.5l-.3.6c-2 4.6-6.5 7.7-11.8 7.7zm14.9-15v-26.2c.3-.4.6-.7.8-1.1 0-.1 0-.1.1-.2 1.9-.8 3.7-1.8 5.5-3.2v4.4c0 12-2.2 16.8-5.7 24.8-.3.5-.5 1-.7 1.5zm107.4-15.3l8.4 10.8c.1.1.1.3 0 .3 0 .1-.1.2-.3.2H330.4c2.2-5.1 3.7-9.5 4.2-16.5h88.8c4 0 7.9 1.9 10.5 5.2zm-65.7-37.7v30.5h-6.1V338.5c1.1.1 2.2.1 3.4.1 1 0 2 0 3-.1-.2.2-.3.4-.3.6zm22.1-6.5c-29.7 9.2-48.8.6-57.8-5.5-.1-.7-.1-1.4-.2-2h6.4c9.1 4.8 19 7.2 29.2 7.2h.9c.1 0 .2.1.3.1.1 0 .2 0 .3-.1 9.8-.2 19.9-2.6 29.7-7.3 27.3-12.8 49.4-39.8 59.9-72.2-3 13.8-8.9 27.6-16.9 39.7-9.1 13.8-25.5 32-51.8 40.1zm65.8-14c.1 1.2-.2 2.3-1 3.1-.8.9-1.9 1.3-3 1.3H415c13.4-8.9 22.8-20.2 29-29.5 3.1-4.6 5.8-9.5 8.2-14.5l3.9 39.6z"/><path d="M322.1 233.3h6.5c.3 0 .5-.2.5-.5s-.2-.5-.5-.5h-5.9l2.2-21.3c0-.3-.2-.5-.4-.5-.3 0-.5.2-.5.4l-2.2 21.9c0 .1 0 .3.1.4-.1 0 0 .1.2.1zm79.7.8h8.3c.3 0 .5-.2.5-.5s-.2-.5-.5-.5h-7.8l2.1-22.1c0-.3-.2-.5-.5-.5s-.5.2-.5.5l-2.2 22.6c0 .1 0 .3.1.4.2 0 .4.1.5.1zm-232.3 8.6c.3.1.7.1 1 .1 1.2 0 2.5-.5 3.3-1.4 1-1 1.4-2.3 1.1-3.6-.1-.5-.7-.9-1.2-.8-.5.1-.9.7-.8 1.2.2.8-.3 1.5-.5 1.8-.6.6-1.6.9-2.5.7-.5-.1-1.1.2-1.2.8-.1.5.3 1.1.8 1.2z"/><path d="M171.4 243.4c-.5 0-1 .4-1 1s.4 1 1 1h.2c2.6 0 5-2 5.5-4.5.1-.5-.2-1.1-.8-1.2-.5-.1-1.1.2-1.2.8-.3 1.7-2 3-3.7 2.9zm-32.3 15.8c.3 0 .7 0 1-.1.5-.1.9-.6.8-1.2-.1-.5-.6-.9-1.2-.8-.9.2-1.8-.1-2.5-.7-.3-.3-.7-.9-.5-1.8.1-.5-.2-1.1-.8-1.2-.5-.1-1.1.2-1.2.8-.3 1.3.1 2.6 1.1 3.6.8.9 2 1.4 3.3 1.4z"/><path d="M138 261.9h.2c.6 0 1-.5 1-1 0-.6-.5-1-1-1-1.7.1-3.4-1.3-3.7-2.9-.1-.5-.6-.9-1.2-.8-.5.1-.9.6-.8 1.2.5 2.5 2.9 4.5 5.5 4.5z"/><path d="M131 264.5c.1 0 .2 0 .4-.1 1.2-.4 2.2-1.1 3-2 .4-.4.3-1-.1-1.4-.4-.4-1-.3-1.4.1-.6.7-1.3 1.2-2.2 1.5-.5.2-.8.8-.6 1.3.1.3.5.6.9.6zm33.7 99.2h-26.1c-4.3 0-7.9-3.5-7.9-7.9v-82c0-.3-.2-.5-.5-.5s-.5.2-.5.5v82c0 4.9 4 8.9 8.9 8.9h26.1c.3 0 .5-.2.5-.5s-.2-.5-.5-.5zm91.6 0h-60.6c-.3 0-.5.2-.5.5s.2.5.5.5h60.6c.3 0 .5-.2.5-.5s-.3-.5-.5-.5z"/></svg>
code:
{{ 'collection-1' | placeholder_svg_tag: 'custom-class' }}
data:
{}
output:
<svg class="custom-class" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 525.5 525.5"><path d="M439.9 310.8c-.2.2-.1.5.1.7l13.2 8.7c.1.1.2.1.3.1.2 0 .3-.1.4-.2.2-.2.1-.5-.1-.7l-13.2-8.7c-.3-.2-.6-.1-.7.1z"/><path d="M463.4 235c1.1-9.4-1-18.6-5.1-21.6-1.7-1.2-3.6-1.3-5.4-.3l-.3.3-6.1-9.8-.1-.1-.8-8.1c-.2-1.9-1.7-3.3-3.6-3.3h-33c-1.6-33-14-75.8-44-75.9h-.1c-7.8 0-14.9 3.1-21.1 9.3-12.5 12.5-21 38.1-22.3 66.5h-20.7v-2.5c0-1.5-1.2-2.7-2.7-2.7h-3.8c-1.5 0-2.7 1.2-2.7 2.7v2.5H288c-1.9 0-3.4 1.4-3.6 3.3l-.8 8.4-5.9 9.5c-.1-.1-.3-.3-.5-.3-.8-.2-2.2-.3-3.6.8-.4.3-.7.6-1.1 1.1-8.5 9.5-6.5 32.6-.8 51.2h-34.5c.1-2.1.2-4.6.4-7.3.6-10.3 1.3-23.1.1-30.3-1.7-10.1-8.9-21.5-13.3-26.6-3.9-4.5-9.3-10.8-11.1-12.9 6.2-4 9.6-9.6 10.1-16.6v-.6c.3-3-.4-7.1-2.8-9.7-1.5-1.7-3.4-2.5-5.7-2.5h-39.6c-.3-11.5-6.3-23-19.3-23-4.3 0-8.2 1.7-11.4 4.5l-.2-.1c0 .1-.1.2-.1.4-4.5 4.2-7.4 10.8-7.6 18.3h-34.9c-2.3 0-4.3.8-5.7 2.5-2.3 2.6-3.1 6.7-2.8 9.7v.6c.5 7 3.9 12.6 10.1 16.6-1.9 2.2-7.3 8.4-11.1 12.9-5.4 6.3-11.9 17.3-13.3 26.6-2 12.9-.8 23 .2 32 .9 7.8 1.7 14.6.3 21.6-.8 1.7-1.7 3.6-2.4 5.6-3.2 8.4-4.4 18.9-3.6 23.5.7 3.9 4.3 6.7 8.9 8.3H62.8c-.6 0-1 .4-1 1V389c0 .6.4 1 1 1h59.7c.2.4.4.8.5 1.2 1.1 2.4 2.2 5 3.5 8.2.1.2.2.5.3.7 2.3 5.2 7.5 8.8 13.5 8.8h171.3c6 0 11.2-3.6 13.5-8.8v-.1l.3-.6c1.3-3.2 2.5-5.9 3.5-8.3.2-.4.4-.8.5-1.2H442c.9 0 1.7-.5 2.1-1.3.4-.8.3-1.7-.2-2.4l-8.4-10.8c-3-3.8-7.4-6-12.3-6h-53v-30.5c0-.3-.1-.5-.3-.7 6.3-.4 13.3-1.6 21-4 7.8-2.4 14.7-5.7 20.9-9.5H452c1.7 0 3.4-.7 4.5-2s1.7-3 1.5-4.7l-4.2-42.4c0-.1-.1-.3-.1-.4 5.8-13.2 9.3-27.2 9.7-40.5.1.4.1.3 0 .3zm-9.4-20.2c1.1-.6 2.2-.6 3.2.2 1.9 1.4 3.5 5 4.2 9.7-1.5-1.6-3.8-2-5.7-2.3l-1.5-.3c-1.4-.3-2.2-1-2.5-2.1-.3-1 0-2.2.7-3.3l1 1.6c.2.3.5.5.8.5.2 0 .4 0 .5-.2.5-.3.6-.9.3-1.4l-1.4-2.2c.2-.1.3-.1.4-.2zm-2.8 0c-1.5 1.7-2 3.8-1.5 5.7.5 1.8 1.9 3 4 3.5.5.1 1.1.2 1.6.3 3.1.6 5.1 1.1 5.5 3.8.1.5.5.8.9.8.1 3-.2 6.4-.9 9.8-1.9 8.8-4.6 17.3-8.2 25.5l-5.7-56.1 4.3 6.7zm-50.1-7.5h8.3l3.1 27.6c.1.5-.1.9-.4 1.2-.3.3-.7.5-1.2.5h-11.4c-.5 0-.9-.2-1.2-.5s-.4-.8-.4-1.2l3.2-27.6zm10.2-.4l-.1-.7c-.1-.5-.5-.9-1-.9h-10.1c-.5 0-.9.4-1 .9l-.1.7v-7.7h2.3v.6c0 1.3 1.1 2.4 2.4 2.4h3.2c1.3 0 2.4-1.1 2.4-2.4v-.6h2v7.7zm-49.2-14.7V140c1 .3 2 .5 3.1.5s2.1-.2 3.1-.5v52.2h-6.2zm-32.6 0c1.2-26.6 8.8-50.1 19.9-61.3 2.6-2.6 5.4-4.5 8.4-5.7-1.3 1.6-2.1 3.6-2.1 5.9 0 3.4 1.8 6.3 4.5 8 0 .1-.1.2-.1.4v52.7h-30.6zm-8.2 15.2h8.3l3.1 27.6c.1.5-.1.9-.4 1.2s-.7.5-1.2.5h-11.4c-.5 0-.9-.2-1.2-.5s-.4-.8-.4-1.2l3.2-27.6zm10.2-.4l-.1-.7c-.1-.5-.5-.9-1-.9h-10.1c-.5 0-.9.4-1 .9l-.1.7v-7.7h2.1v.5c0 1.3 1.1 2.4 2.4 2.4h3c1.3 0 2.4-1.1 2.4-2.4v-.6h2.3v7.8zm33.6-83.2c.6 0 1.2 0 1.7.1 3.3.8 5.8 3.7 5.8 7.2 0 4.1-3.3 7.4-7.4 7.4s-7.4-3.3-7.4-7.4c0-3.5 2.4-6.4 5.7-7.2.5-.1 1-.1 1.6-.1zm5 15.3c2.7-1.7 4.4-4.6 4.4-8 0-2.3-.8-4.3-2.1-6 17.4 6.6 27.3 36.7 28.7 67.1h-31v-52.7c.1-.2.1-.3 0-.4zm-24.8-12c5.8-5.8 12.5-8.8 19.7-8.8h.1c31 .1 42.2 48.8 42.2 81.5 0 .2-.2.4-.4.4h-3.2c-.2 0-.4-.2-.4-.4 0-2.1 0-4.1-.1-6.2.1-.1.1-.3.1-.5s-.1-.4-.2-.5c-1.5-34.5-14-68.8-36.1-70.8-.6-.1-1.3-.2-2-.2s-1.4.1-2 .2c-5.5.5-10.6 3.1-15.2 7.6-12.6 12.5-20.7 40.1-20.7 70.3 0 .2-.2.4-.4.4h-3c-.2 0-.4-.2-.4-.4.1-30.8 8.7-59.3 22-72.6zM299 208h-5.3l1.7-13.5h1.8L299 208zm-5.4-16v-2.3c0-.4.3-.7.7-.7h3.8c.4 0 .7.3.7.7v2.5h-5.4c.2-.1.2-.1.2-.2zm-7.1 3.7c.1-.8.8-1.5 1.6-1.5h5.3l-1.9 14.7c0 .3.1.6.2.8.2.2.5.3.8.3h7.6c.3 0 .6-.1.8-.3.2-.2.3-.5.2-.8l-1.9-14.7h22.3c0 1-.1 2-.1 3.1h-3.1c-.6 0-1 .4-1 1v11.8c0 .6.4 1 1 1 .2 0 .4-.1.6-.2l-2.7 23.9c-.1 1 .2 2 .9 2.8.7.8 1.6 1.2 2.7 1.2h11.4c1 0 2-.4 2.7-1.2.7-.8 1-1.8.9-2.8l-2.7-23.9c.2.1.3.2.6.2.6 0 1-.4 1-1v-11.8c0-.6-.4-1-1-1H329.4c0-1 0-2.1.1-3.1h71.9c0 1 .1 2 .1 3h-3.3c-.6 0-1 .4-1 1V210c0 .6.4 1 1 1 .2 0 .4-.1.6-.2l-2.7 23.9c-.1 1 .2 2 .9 2.8.7.8 1.6 1.2 2.7 1.2h11.4c1 0 2-.4 2.7-1.2.7-.8 1-1.8.9-2.8l-2.7-23.9c.2.1.3.2.6.2.6 0 1-.4 1-1v-11.8c0-.6-.4-1-1-1h-3c0-1 0-2-.1-3.1h32.9c.8 0 1.5.6 1.6 1.5l7.3 72.1c-11.7 24.7-30.6 45-52.5 55.3h-66.3c0-.4-.1-.9-.1-1.3-.5-4.8-.9-9.5-1.3-14.1h81.6c.3 0 .5-.2.5-.5s-.2-.5-.5-.5H331c-.6-7.5-1.1-14.8-1.1-22v-15.1c0-1.8-1.5-3.3-3.3-3.3h-22.2v-5.7c0-.6-.4-1-1-1h-17.2c-.6 0-1 .4-1 1v5.7h-5.5l6.8-70.5zm75.6 134.2V325h6.1v5.1c-2.1.1-4.1 0-6.1-.2zm-18.6-4.9h16.6v4.6c-5.7-.7-11.3-2.2-16.6-4.6zm26.7 0h23.6c-7.9 3.1-15.8 4.8-23.6 5.1V325zm-10.1 44.6h-25.3c.1-1.2.1-2.5.1-3.8v-6.2c1.1-1.1 2.1-2.3 3.1-3.6.2-.2.2-.5.2-.8l-1.8-11.2c-.1-.4-.4-.7-.8-.8-.4-.1-.8.1-1 .5-.1.2-.3.5-.4.7-.4-5-.8-9.9-1.2-14.8 5.8 3.7 14.8 7.8 27.3 8.8 0 .1-.1.2-.1.3v30.9zm-81.5 6.8h.7v9.6h-.7v-9.6zm-2 16.3h-10.9v-16.3h4.5v8.9c0 .6.4 1 1 1s1-.4 1-1v-8.9h4.5v16.3zm-101.2 1h10.9v8.7l-5.5 4.4-5.5-4.4v-8.7zm-2-7.8h-.7v-9.6h.7v9.6zm2 1v-10.6h4.5v8.9c0 .6.4 1 1 1s1-.4 1-1v-8.9h4.5v15.3h-10.9v-4.7zm0-30.7h10.9v18.2h-4.5v-1c0-.6-.4-1-1-1s-1 .4-1 1v1h-4.5v-18.2zm12.9 20.2h.7v9.6h-.7v-9.6zm-.4 27.3c.2-.2.4-.5.4-.8v-9.2h1.3c.6 0 1-.4 1-1s-.4-1-1-1h-1.3v-3.8h1.7c.6 0 1-.4 1-1v-11.6c0-.6-.4-1-1-1h-1.7v-4.1c.2.2.4.3.7.3h74.4c.1 0 .2 0 .3-.1v3.8H262c-.6 0-1 .4-1 1v11.6c0 .6.4 1 1 1h1.7v4.8h-1.3c-.6 0-1 .4-1 1s.4 1 1 1h1.3v8.2c0 .3.1.6.4.8l4.3 3.4h-84.8l4.3-3.3zm75.8-17.8h-.7v-9.6h.7v9.6zm2 16.6v-7.7h10.9v7.7l-5.5 4.4-5.4-4.4zm6.5-28.1v-1c0-.6-.4-1-1-1s-1 .4-1 1v1h-4.5v-18.2h10.9v18.2h-4.4zm6.4-18.2h2.8c.6 0 1-.4 1-1s-.4-1-1-1h-20.6c-.6 0-1 .4-1 1s.4 1 1 1h2.8v12.5c-.1 0-.2-.1-.3-.1H189c-.3 0-.6.1-.7.3v-12.8h2.8c.6 0 1-.4 1-1s-.4-1-1-1h-20.6c-.6 0-1 .4-1 1s.4 1 1 1h2.8v12.6c-.1-.1-.3-.1-.5-.1h-37.2c-6.2 0-11.2-5-11.2-11.2v-88c0-.7.6-1.3 1.3-1.3h51.7c2 3.3 6.8 9.6 17.9 17.6l-1.1 1.4c-.2.2-.2.5-.2.7 0 .3.2.5.4.7l4 3.1-.6.8c-.3.4-.3 1.1.2 1.4.2.1.4.2.6.2.3 0 .6-.1.8-.4l.6-.8 4 3.1c.2.1.4.2.6.2.3 0 .6-.1.8-.4l1.1-1.4 4.7 3.6c-.1.1-.2.1-.3.2-.8 1.1-1.2 2.5-1 3.8.2 1.4.9 2.6 2 3.5l48.7 37.3c.9.7 2 1.1 3.2 1.1h.7c1.4-.2 2.6-.9 3.5-2 .2-.2.2-.5.2-.7 21.9 14.6 38.4 24.9 51.4 24.9 1.5 0 3-.2 4.5-.5-2.1 1.9-4.8 3-7.6 3h-37.7v-12.3zM152.6 197v5h-6.5v-5h6.5zm-6.5 6h6.5v3.2h-6.5V203zm7.5 5.2c.6 0 1-.4 1-1V197h6.2v10.2c0 .6.4 1 1 1h2.9c.2 10.1 1.1 18.1 3 24.4h-18.9c1.7-7.8 2.6-16.3 2.2-24.4h2.6zm9.2-2V203h6.5v3.2h-6.5zm6.6-4.2h-6.5v-5h6.5v5zm-1 32.6c.5 1.6 1.1 3 1.8 4.3.2.3.5.6.9.6.2 0 .3 0 .4-.1.5-.2.7-.8.4-1.3-.5-1-1-2.2-1.4-3.4H208v8.6h-25.4c-.3 0-.5.2-.5.5s.2.5.5.5H208v4h-27.1c-.7-.3-3.4-2.6-4.2-3.5-.4-.4-1-.5-1.4-.1-.4.4-.5 1-.1 1.4.4.4 1.3 1.3 2.4 2.2h-34c.6-1.3 1.2-2.6 1.7-4h19.4c.3 0 .5-.2.5-.5s-.2-.5-.5-.5h-19c1-2.7 1.9-5.6 2.6-8.6h20.1zm30.6 25.5h-4.6l1.5-9.5h1.6l1.5 9.5zm-55.4-17h-34.9v-8.6h37.6c-.8 3.1-1.7 6-2.7 8.6zm-34.9 1h34.5c-.6 1.4-1.2 2.8-1.8 4h-32.7v-4zm4.3 6.1h27.3c-.7 1.3-1.5 2.5-2.3 3.6-.3.4-.2 1.1.2 1.4.2.1.4.2.6.2.3 0 .6-.1.8-.4 1-1.4 2-3 2.9-4.8h51.3l-1.7 10.8c0 .3 0 .6.2.8.2.2.5.4.8.4h6.9c.3 0 .6-.1.8-.4.2-.2.3-.5.2-.8l-1.7-10.8h4.8v16h-11.9c-2.5-2.7-3.6-4.5-3.7-4.6-.2-.4-.7-.6-1.1-.4l-10.7 3.1c-.3.1-.5.2-.6.5-.1.2-.2.5-.1.8l.2.6h-8.8v-5.7c0-.6-.4-1-1-1h-17.2c-.6 0-1 .4-1 1v5.7h-22.6c-1.8 0-3.3 1.5-3.3 3.3v15.1c0 5.5-.3 11-.7 16.6h-2.7c-5.4-.4-6.1-2.8-6.1-4.9v-46.1zm207.4 18v85.3c-11.3.5-26.1-9.9-43.2-21.8-.3-.2-.6-.4-.9-.7 1.7-2.3 1.3-5.5-1-7.3l-48.6-37.3c-1.1-.8-2.5-1.2-3.9-1-1.4.2-2.6.9-3.5 2 0 0-.1.1-.1.2l-4.7-3.6 1-1.3c.2-.2.2-.5.2-.7 0-.3-.2-.5-.4-.7l-4-3.1.6-.8c.3-.4.3-1.1-.2-1.4-.4-.3-1.1-.3-1.4.2l-.6.8-4-3.1c-.4-.3-1.1-.3-1.4.2l-1.1 1.4c-3.8-2.5-6.8-5-9-7.2h126.2zm-18.3-2h-15.2v-4.7h15.2v4.7zm25.5 85c-1.4.9-3 1.5-4.6 1.9-.5.1-1 .2-1.6.2v-85.2h4.8c.7 0 1.3.6 1.3 1.3v81.7c0 .1.1.1.1.1zm2.5-29.3c.8 8.1 1.6 16.5 2.2 25.1-.9 1.1-1.8 2-2.7 2.8v-33.2c.1 1.8.3 3.5.5 5.3zm-68.2 15.2c1.7 1.1 3.3 2.2 4.9 3.3-.2.1-.4.2-.5.3-.5.7-1.3 1.1-2.1 1.2-.8.1-1.7-.1-2.4-.6l-2.2-1.7c.2 0 .5-.1.6-.4l1.7-2.1zm-3.3 1c-.2.2-.2.5-.2.7l-7.8-6c.2 0 .5-.1.6-.4l2.4-3.1 6.9-9 2.7-3.5 7.4 5.7-12 15.6zm-80.1-72.2l8.9-2.6c1.3 1.9 5.7 7.7 14.7 13.6l-5.6 7.3c-12.6-9.1-16.8-15.9-18-18.3zm18.4 21.1l3.2 2.5-.5.6-3.2-2.5.5-.6zm4.8 3.7l3.2 2.5-.5.6-3.2-2.5.5-.6zm-3.6-5.3l5.6-7.3 8.1 6.2-5.6 7.3-8.1-6.2zm14.9-2.7l-3.2-2.5.4-.5 3.2 2.5-.4.5zm-4.8-3.7l-3.2-2.5.4-.5 3.2 2.5-.4.5zm5.2 6.5l10.3 7.9-5.7 7.4-10.3-7.9 5.7-7.4zm11.5 6.3l-4.1-3.2.1-.1c.5-.7 1.3-1.1 2.1-1.2.9-.1 1.7.1 2.4.6l1.6 1.2-2.1 2.7zm-12.4 7.7c.1-.1.1-.2.2-.3l4.1 3.2-2.2 2.8-1.5-1.2c-.7-.5-1.1-1.3-1.2-2.1s.1-1.7.6-2.4zm13.4-5.7l2.7-3.5 7.4 5.7-9.6 12.5-2.8 3.6-7.4-5.7 9.7-12.6zm26.7 33.5l-24-18.4 5.7-7.4 24 18.4-5.7 7.4zm6.9-9l-24-18.4 2.1-2.7 24 18.4-2.1 2.7zm-32.1-7.8l24 18.4-1.7 2.3c-.2.2-.2.5-.2.7l-24.2-18.6 2.1-2.8zm44.7 13.3l2 1.5c1.4 1.1 1.7 3.1.6 4.5v.1c-1.5-1.1-3.1-2.2-4.7-3.3l2.1-2.8zm-121.7-57.6v-4.7h15.2v4.7h-15.2zm112.7 69.3l5.7-7.4c2.5 1.7 4.9 3.4 7.3 5.1 19.5 13.7 34.9 24.4 47.3 21.8 4.1-.9 7.6-3.2 10.6-7l.3-.3c.2-.3.4-.5.6-.8l1.3 8.2c-15 19.2-35.7 5.5-73.1-19.6zm15.1-77.8c-5-7.8-7.1-17.4-7.3-25.5.2.4.5.6.9.6.1 0 .2 0 .4-.1.5-.2.8-.8.6-1.3-.8-2 1.6-4.1 4.1-6.4 2.4-2.2 4.8-4.4 4.7-6.9-.1-1.3-.8-2.5-2.2-3.6l3.8-6.1-5 49.3zm-1.5-42.8l-1.4 2.2c-.3.5-.1 1.1.3 1.4.2.1.3.2.5.2.3 0 .7-.2.8-.5l1.3-2.1c.8.7 1.2 1.3 1.2 2 .1 1.6-2 3.5-4.1 5.3-1.8 1.6-3.8 3.4-4.5 5.4.2-5.4 1.3-9.8 2.9-12.2.1-.2.2-.3.3-.5.3-.3.5-.6.8-.8.7-.4 1.3-.5 1.9-.4zm-7.7 17.7c0 1 .1 2 .2 3.1.8 9.6 4 18.5 8.8 25.1l-.5 5.4H274c-3.6-11.1-5.6-23.5-5-33.6zm-46.1-29.3c4.3 5 11.2 15.9 12.8 25.6 1.2 7 .4 20.2-.1 29.9-.2 2.7-.3 5.2-.4 7.3h-29v-16h2.8c.6 0 1-.4 1-1v-15.6c0-.6-.4-1-1-1h-39.2c-1.9-6.1-2.9-14.3-3.1-24.4h3.6c.6 0 1-.4 1-1V197h2.8c16.7 0 29.1-2.3 37.4-6.9 1.7 1.9 7.4 8.5 11.4 13.2zm-10-40.3c1.7 1.8 2.2 4.8 1.9 6.8v.5c-1 12.7-15.2 19.1-42.4 19.1h-28.1c-27.1 0-41.4-6.4-42.4-19.1v-.5c-.2-2.1.3-5 1.9-6.8.5-.6 1.1-1 1.8-1.3H211c.7.3 1.3.7 1.9 1.3zm-39.6-3.3h-6c.7-2.7 2.1-9.2 1.2-15.2 3.3 4.1 4.7 9.8 4.8 15.2zm-7.5-18c2.3 6.5.1 15.6-.6 18h-18.4c-.6-2.3-2.7-10.7-.8-17.2 2.8-2.5 6.2-3.9 10-3.9 4.1-.1 7.3 1.1 9.8 3.1zm-22.4 3.6c-.7 5.8.7 11.8 1.3 14.4h-6c.2-5.7 1.9-10.7 4.7-14.4zm-48.1 27c0-.2 0-.5-.1-.7-.2-2.5.4-6.1 2.3-8.2 1.1-1.2 2.5-1.8 4.3-1.8h2c-.2.2-.5.4-.7.6-1.9 2.1-2.4 5.3-2.2 7.6v.5c1 13.3 15.6 20 43.4 20h28.1c27.7 0 42.3-6.7 43.4-20v-.5c.2-2.3-.3-5.6-2.2-7.6-.2-.2-.4-.4-.7-.6h2c1.7 0 3.2.6 4.3 1.8 1.9 2.1 2.5 5.7 2.3 8.2 0 .2 0 .4-.1.7-1.1 15-17 22.7-47.3 22.7h-31.6c-30.2 0-46.1-7.6-47.2-22.7zm-14.1 88.1c-1-8.8-2.2-18.9-.2-31.5 1.5-9.5 8.5-20.6 12.8-25.6 4-4.7 9.7-11.3 11.4-13.2 8.2 4.6 20.7 6.9 37.4 6.9h1.6v10.2c0 .6.4 1 1 1h3.8c.4 8.1-.5 16.6-2.2 24.4h-39c-.6 0-1 .4-1 1v15.6c0 .6.4 1 1 1h3.3v37H79.5c3-7.4 6.8-12.6 6.9-12.7.3-.4.2-1.1-.2-1.4-.4-.3-1.1-.2-1.4.2-.1.1-1.1 1.6-2.5 3.9.3-5.4-.4-10.8-1.1-16.8zM75.4 311c-.7-4.1.4-14 3.3-21.8H111v7.1c0 4.2 2.7 6.5 8 6.9h2.7c-.4 5.4-.9 10.9-1.5 16.5H94.6c-12.1-.1-18.4-4.6-19.2-8.7zm-11.6 77.1v-66.5H120c-1.4 14.1-2.9 28.7-2.8 44.1 0 10.7 1.8 16 4.5 22.3H63.8zm55.3-22.3c0-15.3 1.4-29.8 2.8-43.9.2-1.8.3-3.5.5-5.2v40.8c0 3.2 1.2 6.2 3.1 8.5v26.2c-.2-.5-.5-1.1-.7-1.6-3.5-8-5.6-12.8-5.7-24.8zm9.5 33.7c-.1-.2-.2-.5-.3-.7-.5-1.4-.8-2.9-.8-4.5v-26.5c2.2 1.8 5.1 2.8 8.1 2.8h37.2c.2 0 .3-.1.5-.1v3.9h-1.7c-.6 0-1 .4-1 1V387c0 .6.4 1 1 1h1.7v3.8H172c-.6 0-1 .4-1 1s.4 1 1 1h1.3v9.2c0 .3.1.6.4.8l4.3 3.4h-37.7c-5.2-.1-9.7-3.2-11.7-7.7zm183 7.6H274l4.3-3.4c.2-.2.4-.5.4-.8v-8.2h1.3c.6 0 1-.4 1-1s-.4-1-1-1h-1.3v-4.8h1.7c.6 0 1-.4 1-1v-11.6c0-.6-.4-1-1-1h-1.7v-3.7h37.7c3 0 5.8-1 8.1-2.8v26.5c0 1.6-.3 3.1-.8 4.5l-.3.6c-2 4.6-6.5 7.7-11.8 7.7zm14.9-15v-26.2c.3-.4.6-.7.8-1.1 0-.1 0-.1.1-.2 1.9-.8 3.7-1.8 5.5-3.2v4.4c0 12-2.2 16.8-5.7 24.8-.3.5-.5 1-.7 1.5zm107.4-15.3l8.4 10.8c.1.1.1.3 0 .3 0 .1-.1.2-.3.2H330.4c2.2-5.1 3.7-9.5 4.2-16.5h88.8c4 0 7.9 1.9 10.5 5.2zm-65.7-37.7v30.5h-6.1V338.5c1.1.1 2.2.1 3.4.1 1 0 2 0 3-.1-.2.2-.3.4-.3.6zm22.1-6.5c-29.7 9.2-48.8.6-57.8-5.5-.1-.7-.1-1.4-.2-2h6.4c9.1 4.8 19 7.2 29.2 7.2h.9c.1 0 .2.1.3.1.1 0 .2 0 .3-.1 9.8-.2 19.9-2.6 29.7-7.3 27.3-12.8 49.4-39.8 59.9-72.2-3 13.8-8.9 27.6-16.9 39.7-9.1 13.8-25.5 32-51.8 40.1zm65.8-14c.1 1.2-.2 2.3-1 3.1-.8.9-1.9 1.3-3 1.3H415c13.4-8.9 22.8-20.2 29-29.5 3.1-4.6 5.8-9.5 8.2-14.5l3.9 39.6z"/><path d="M322.1 233.3h6.5c.3 0 .5-.2.5-.5s-.2-.5-.5-.5h-5.9l2.2-21.3c0-.3-.2-.5-.4-.5-.3 0-.5.2-.5.4l-2.2 21.9c0 .1 0 .3.1.4-.1 0 0 .1.2.1zm79.7.8h8.3c.3 0 .5-.2.5-.5s-.2-.5-.5-.5h-7.8l2.1-22.1c0-.3-.2-.5-.5-.5s-.5.2-.5.5l-2.2 22.6c0 .1 0 .3.1.4.2 0 .4.1.5.1zm-232.3 8.6c.3.1.7.1 1 .1 1.2 0 2.5-.5 3.3-1.4 1-1 1.4-2.3 1.1-3.6-.1-.5-.7-.9-1.2-.8-.5.1-.9.7-.8 1.2.2.8-.3 1.5-.5 1.8-.6.6-1.6.9-2.5.7-.5-.1-1.1.2-1.2.8-.1.5.3 1.1.8 1.2z"/><path d="M171.4 243.4c-.5 0-1 .4-1 1s.4 1 1 1h.2c2.6 0 5-2 5.5-4.5.1-.5-.2-1.1-.8-1.2-.5-.1-1.1.2-1.2.8-.3 1.7-2 3-3.7 2.9zm-32.3 15.8c.3 0 .7 0 1-.1.5-.1.9-.6.8-1.2-.1-.5-.6-.9-1.2-.8-.9.2-1.8-.1-2.5-.7-.3-.3-.7-.9-.5-1.8.1-.5-.2-1.1-.8-1.2-.5-.1-1.1.2-1.2.8-.3 1.3.1 2.6 1.1 3.6.8.9 2 1.4 3.3 1.4z"/><path d="M138 261.9h.2c.6 0 1-.5 1-1 0-.6-.5-1-1-1-1.7.1-3.4-1.3-3.7-2.9-.1-.5-.6-.9-1.2-.8-.5.1-.9.6-.8 1.2.5 2.5 2.9 4.5 5.5 4.5z"/><path d="M131 264.5c.1 0 .2 0 .4-.1 1.2-.4 2.2-1.1 3-2 .4-.4.3-1-.1-1.4-.4-.4-1-.3-1.4.1-.6.7-1.3 1.2-2.2 1.5-.5.2-.8.8-.6 1.3.1.3.5.6.9.6zm33.7 99.2h-26.1c-4.3 0-7.9-3.5-7.9-7.9v-82c0-.3-.2-.5-.5-.5s-.5.2-.5.5v82c0 4.9 4 8.9 8.9 8.9h26.1c.3 0 .5-.2.5-.5s-.2-.5-.5-.5zm91.6 0h-60.6c-.3 0-.5.2-.5.5s.2.5.5.5h60.6c.3 0 .5-.2.5-.5s-.3-.5-.5-.5z"/></svg>
Deprecated: false
string | preload_tag: as: string
Generates an HTML `<link>` tag with a `rel` attribute of `preload` to prioritize loading a given Shopify-hosted asset. The asset URL is also added to the [Link header](https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Link) with a `rel` attribute of `preload`.
code:
{{ 'cart.js' | asset_url | preload_tag: as: 'script' }}
data:
{}
output:
<link href="//polinas-potent-potions.myshopify.com/cdn/shop/t/4/assets/cart.js?v=83971781268232213281663872410" as="script" rel="preload">
code:
{{ 'cart.js' | asset_url | preload_tag: as: 'script', type: 'text/javascript' }}
data:
{}
output:
<link href="//polinas-potent-potions.myshopify.com/cdn/shop/t/4/assets/cart.js?v=83971781268232213281663872410" as="script" type="text/javascript" rel="preload">
Deprecated: false
string | script_tag
Generates an HTML `<script>` tag for a given resource URL. The tag has a `type` attribute of `text/javascript`.
code:
{{ 'cart.js' | asset_url | script_tag }}
data:
{}
output:
<script src="//polinas-potent-potions.myshopify.com/cdn/shop/t/4/assets/cart.js?v=83971781268232213281663872410" type="text/javascript"></script>
Deprecated: false
string | stylesheet_tag
Generates an HTML `<link>` tag for a given resource URL. The tag has the following parameters: | Attribute | Value | | --- | --- | | `rel` | `stylesheet` | | `type` | `text/css` | | `media` | `all` |
code:
{{ 'base.css' | asset_url | stylesheet_tag }}
data:
{}
output:
<link href="//polinas-potent-potions.myshopify.com/cdn/shop/t/4/assets/base.css?v=88290808517547527771663872409" rel="stylesheet" type="text/css" media="all" />
code:
data:
output:
Deprecated: false
string | time_tag: string
Converts a timestamp into an HTML `<time>` tag.
code:
{{ article.created_at | time_tag: '%B %d, %Y' }}
data:
{"article":{"created_at":"2022-04-14 16:56:02 -0400"}}
output:
<time datetime="2022-04-14T20:56:02Z">April 14, 2022</time>
code:
{{ article.created_at | time_tag: format: 'abbreviated_date' }}
data:
{"article":{"created_at":"2022-04-14 16:56:02 -0400"}}
output:
<time datetime="2022-04-14T20:56:02Z">Apr 14, 2022</time>
code:
{{ article.created_at | time_tag: '%B %d, %Y', datetime: '%Y-%m-%d' }}
data:
{"article":{"created_at":"2022-04-14 16:56:02 -0400"}}
output:
<time datetime="2022-04-14">April 14, 2022</time>
code:
{{ article.created_at | time_tag: format: 'month_day_year' }}
data:
{"article":{"created_at":"2022-04-14 16:56:02 -0400"}}
output:
<time datetime="2022-04-14T20:56:02Z">April 14, 2022</time>
Localization filters enable you to customize the language and format of elements according to the customer’s locale.
Deprecated: true
form | currency_selector
Generates an HTML `<select>` element with an option for each currency available on the store.
code:
{% form 'currency' %}
{{ form | currency_selector }}
{% endform %}
data:
{}
output:
<form method="post" action="/cart/update" id="currency_form" accept-charset="UTF-8" class="shopify-currency-form" enctype="multipart/form-data"><input type="hidden" name="form_type" value="currency" /><input type="hidden" name="utf8" value="✓" /><input type="hidden" name="return_to" value="/services/liquid_rendering/resource" />
<select name="currency"><option value="AED">AED د.إ</option><option value="AFN">AFN ؋</option><option value="AUD">AUD $</option><option value="CAD" selected="selected">CAD $</option><option value="CHF">CHF CHF</option><option value="CZK">CZK Kč</option><option value="DKK">DKK kr.</option><option value="EUR">EUR €</option><option value="GBP">GBP £</option><option value="HKD">HKD $</option><option value="ILS">ILS ₪</option><option value="JPY">JPY ¥</option><option value="KRW">KRW ₩</option><option value="MYR">MYR RM</option><option value="NZD">NZD $</option><option value="PLN">PLN zł</option><option value="SEK">SEK kr</option><option value="SGD">SGD $</option><option value="USD">USD $</option></select>
</form>
code:
{% form 'currency' %}
{{ form | currency_selector: class: 'custom-class' }}
{% endform %}
data:
{}
output:
<form method="post" action="/cart/update" id="currency_form" accept-charset="UTF-8" class="shopify-currency-form" enctype="multipart/form-data"><input type="hidden" name="form_type" value="currency" /><input type="hidden" name="utf8" value="✓" /><input type="hidden" name="return_to" value="/services/liquid_rendering/resource" />
<select class="custom-class" name="currency"><option value="AED">AED د.إ</option><option value="AFN">AFN ؋</option><option value="AUD">AUD $</option><option value="CAD" selected="selected">CAD $</option><option value="CHF">CHF CHF</option><option value="CZK">CZK Kč</option><option value="DKK">DKK kr.</option><option value="EUR">EUR €</option><option value="GBP">GBP £</option><option value="HKD">HKD $</option><option value="ILS">ILS ₪</option><option value="JPY">JPY ¥</option><option value="KRW">KRW ₩</option><option value="MYR">MYR RM</option><option value="NZD">NZD $</option><option value="PLN">PLN zł</option><option value="SEK">SEK kr</option><option value="SGD">SGD $</option><option value="USD">USD $</option></select>
</form>
code:
{% form 'currency' %}
{{ form | currency_selector: id: 'custom-id' }}
{% endform %}
data:
{}
output:
<form method="post" action="/cart/update" id="currency_form" accept-charset="UTF-8" class="shopify-currency-form" enctype="multipart/form-data"><input type="hidden" name="form_type" value="currency" /><input type="hidden" name="utf8" value="✓" /><input type="hidden" name="return_to" value="/services/liquid_rendering/resource" />
<select id="custom-id" name="currency"><option value="AED">AED د.إ</option><option value="AFN">AFN ؋</option><option value="AUD">AUD $</option><option value="CAD" selected="selected">CAD $</option><option value="CHF">CHF CHF</option><option value="CZK">CZK Kč</option><option value="DKK">DKK kr.</option><option value="EUR">EUR €</option><option value="GBP">GBP £</option><option value="HKD">HKD $</option><option value="ILS">ILS ₪</option><option value="JPY">JPY ¥</option><option value="KRW">KRW ₩</option><option value="MYR">MYR RM</option><option value="NZD">NZD $</option><option value="PLN">PLN zł</option><option value="SEK">SEK kr</option><option value="SGD">SGD $</option><option value="USD">USD $</option></select>
</form>
Deprecated: false
address | format_address
Generates an HTML address display, with each address component ordered according to the address's locale.
code:
{{ shop.address | format_address }}
data:
{}
output:
<p>Polina&#39;s Potions, LLC<br>150 Elgin Street<br>8th floor<br>Ottawa ON K2P 1L4<br>Canada</p>
code:
{{ customer.default_address | format_address }}
data:
{}
output:
<p>Cornelius Potionmaker<br>12 Phoenix Feather Alley<br>1<br>Calgary AB T1X 0L4<br>Canada</p>
Deprecated: false
string | t
Returns a string of translated text for a given translation key from a [locale file](/themes/architecture/locales).
code:
data:
output:
code:
data:
output:
Math filters perform mathematical operations on numbers. You can apply math filters to numbers, or variables or metafields that return a number. As with any other filters, you can use multiple math filters on a single input. They’re applied from left to right. In the example below, `minus` is applied first, then `times`, and finally `divided_by`. ```liquid You save {{ product.compare_at_price | minus: product.price | times: 100.0 | divided_by: product.compare_at_price }}%```
Deprecated: false
number | abs
Returns the absolute value of a number.
code:
{{ -3 | abs }}
data:
{}
output:
3
Deprecated: false
number | at_least
Limits a number to a minimum value.
code:
{{ 4 | at_least: 5 }}
{{ 4 | at_least: 3 }}
data:
{}
output:
5
4
Deprecated: false
number | at_most
Limits a number to a maximum value.
code:
{{ 6 | at_most: 5 }}
{{ 4 | at_most: 5 }}
data:
{}
output:
5
4
Deprecated: false
number | ceil
Rounds a number up to the nearest integer.
code:
{{ 1.2 | ceil }}
data:
{}
output:
2
Deprecated: false
number | divided_by: number
Divides a number by a given number. The `divided_by` filter produces a result of the same type as the divisor. This means if you divide by an integer, the result will be an integer, and if you divide by a float, the result will be a float.
code:
{{ 4 | divided_by: 2 }}
# divisor is an integer
{{ 20 | divided_by: 7 }}
# divisor is a float
{{ 20 | divided_by: 7.0 }}
data:
{}
output:
2
# divisor is an integer
2
# divisor is a float
2.857142857142857
Deprecated: false
number | floor
Rounds a number down to the nearest integer.
code:
{{ 1.2 | floor }}
data:
{}
output:
1
Deprecated: false
number | minus: number
Subtracts a given number from another number.
code:
{{ 4 | minus: 2 }}
data:
{}
output:
2
Deprecated: false
number | modulo: number
Returns the remainder of dividing a number by a given number.
code:
{{ 12 | modulo: 5 }}
data:
{}
output:
2
Deprecated: false
number | plus: number
Adds two numbers.
code:
{{ 2 | plus: 2 }}
data:
{}
output:
4
Deprecated: false
number | round
Rounds a number to the nearest integer.
code:
{{ 2.7 | round }}
{{ 1.3 | round }}
data:
{}
output:
3
1
code:
{{ 3.14159 | round: 2 }}
data:
{}
output:
3.14
Deprecated: false
number | times: number
Multiplies a number by a given number.
code:
{{ 2 | times: 2 }}
data:
{}
output:
4
Media filters enable you to render media associated with various store resources, such as [products](/docs/api/liquid/objects/product) and [collections](/docs/api/liquid/objects/collection).
Deprecated: true
variable | article_img_url
Returns the [CDN URL](/themes/best-practices/performance/platform#shopify-cdn) for an [article's image](/docs/api/liquid/objects/article#article-image).
code:
{{ article.image | article_img_url }}
data:
{"article":{"image":"articles/beakers-for-science-with-water.jpg"}}
output:
//polinas-potent-potions.myshopify.com/cdn/shop/articles/beakers-for-science-with-water_small.jpg?v=1654385193
code:
{{ article.image | article_img_url: 'large' }}
data:
{"article":{"image":"articles/beakers-for-science-with-water.jpg"}}
output:
//polinas-potent-potions.myshopify.com/cdn/shop/articles/beakers-for-science-with-water_large.jpg?v=1654385193
Deprecated: true
variable | collection_img_url
Returns the [CDN URL](/themes/best-practices/performance/platform#shopify-cdn) for a [collection's image](/docs/api/liquid/objects/collection#collection-image).
code:
{{ collection.image | collection_img_url }}
data:
{"collection":{"image":"collections/sale-written-in-lights.jpg"}}
output:
//polinas-potent-potions.myshopify.com/cdn/shop/collections/sale-written-in-lights.jpg?v=1657654130
code:
{{ collection.image | collection_img_url: 'large' }}
data:
{"collection":{"image":"collections/sale-written-in-lights.jpg"}}
output:
//polinas-potent-potions.myshopify.com/cdn/shop/collections/sale-written-in-lights_large.jpg?v=1657654130
Deprecated: false
variable | external_video_tag
Generates an HTML `<iframe>` tag containing the player for a given external video. The input for the `external_video_tag` filter can be either a [`media` object](/docs/api/liquid/objects/media) or [`external_video_url`](/docs/api/liquid/filters/external_video_url).
code:
{% for media in product.media %}
{% if media.media_type == 'external_video' %}
{% if media.host == 'youtube' %}
{{ media | external_video_url: color: 'white' | external_video_tag }}
{% elsif media.host == 'vimeo' %}
{{ media | external_video_url: loop: '1', muted: '1' | external_video_tag }}
{% endif %}
{% endif %}
{% endfor %}
data:
{}
output:
<iframe frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen="allowfullscreen" src="https://www.youtube.com/embed/vj01PAffOac?color=white&amp;controls=1&amp;enablejsapi=1&amp;modestbranding=1&amp;origin=https%3A%2F%2Fpolinas-potent-potions.myshopify.com&amp;playsinline=1&amp;rel=0" title="Potion beats"></iframe>
code:
{% for media in product.media %}
{% if media.media_type == 'external_video' %}
{% if media.host == 'youtube' %}
{{ media | external_video_url: color: 'white' | external_video_tag: class:'youtube-video' }}
{% endif %}
{% endif %}
{% endfor %}
data:
{}
output:
<iframe frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen="allowfullscreen" class="youtube-video" src="https://www.youtube.com/embed/vj01PAffOac?color=white&amp;controls=1&amp;enablejsapi=1&amp;modestbranding=1&amp;origin=https%3A%2F%2Fpolinas-potent-potions.myshopify.com&amp;playsinline=1&amp;rel=0" title="Potion beats"></iframe>
Deprecated: false
media | external_video_url: attribute: string
Returns the URL for a given external video. Use this filter to specify parameters for the external video player generated by the [`external_video_tag` filter](/docs/api/liquid/filters/external_video_tag).
code:
{% for media in product.media %}
{% if media.media_type == 'external_video' %}
{% if media.host == 'youtube' %}
{{ media | external_video_url: color: 'white' | external_video_tag }}
{% elsif media.host == 'vimeo' %}
{{ media | external_video_url: loop: '1', muted: '1' | external_video_tag }}
{% endif %}
{% endif %}
{% endfor %}
data:
{}
output:
<iframe frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen="allowfullscreen" src="https://www.youtube.com/embed/vj01PAffOac?color=white&amp;controls=1&amp;enablejsapi=1&amp;modestbranding=1&amp;origin=https%3A%2F%2Fpolinas-potent-potions.myshopify.com&amp;playsinline=1&amp;rel=0" title="Potion beats"></iframe>
Deprecated: false
string | image_tag
Generates an HTML `<img>` tag for a given [`image_url`](/docs/api/liquid/filters/image_url).
code:
{{ product | image_url: width: 200 | image_tag }}
data:
{}
output:
<img src="//polinas-potent-potions.myshopify.com/cdn/shop/files/science-beakers-blue-light-new.jpg?v=1683744744&amp;width=200" alt="Health potion" srcset="//polinas-potent-potions.myshopify.com/cdn/shop/files/science-beakers-blue-light-new.jpg?v=1683744744&amp;width=200 200w" width="200" height="133">
code:
data:
{}
output:
code:
{{ images['potions-header.png'] | image_url: width: 300 | image_tag }}
data:
{}
output:
<img src="//polinas-potent-potions.myshopify.com/cdn/shop/files/potions-header.png?v=1650325393&amp;width=300" alt="" srcset="//polinas-potent-potions.myshopify.com/cdn/shop/files/potions-header.png?v=1650325393&amp;width=300 300w" width="300" height="173" style="object-position:1.9231% 9.7917%;">
code:
<!-- With a width -->
{{ product | image_url: width: 400 | image_tag: width: 300 }}
<!-- With the width set to nil -->
{{ product | image_url: width: 400 | image_tag: width: nil }}
data:
{}
output:
<!-- With a width -->
<img src="//polinas-potent-potions.myshopify.com/cdn/shop/files/science-beakers-blue-light-new.jpg?v=1683744744&amp;width=400" alt="Health potion" srcset="//polinas-potent-potions.myshopify.com/cdn/shop/files/science-beakers-blue-light-new.jpg?v=1683744744&amp;width=300 300w, //polinas-potent-potions.myshopify.com/cdn/shop/files/science-beakers-blue-light-new.jpg?v=1683744744&amp;width=352 352w" width="300">
<!-- With the width set to nil -->
<img src="//polinas-potent-potions.myshopify.com/cdn/shop/files/science-beakers-blue-light-new.jpg?v=1683744744&amp;width=400" alt="Health potion" srcset="//polinas-potent-potions.myshopify.com/cdn/shop/files/science-beakers-blue-light-new.jpg?v=1683744744&amp;width=352 352w">
code:
<!-- With a height -->
{{ product | image_url: width: 400 | image_tag: height: 300 }}
<!-- With the height set to nil -->
{{ product | image_url: width: 400 | image_tag: height: nil }}
data:
{}
output:
<!-- With a height -->
<img src="//polinas-potent-potions.myshopify.com/cdn/shop/files/science-beakers-blue-light-new.jpg?v=1683744744&amp;width=400" alt="Health potion" srcset="//polinas-potent-potions.myshopify.com/cdn/shop/files/science-beakers-blue-light-new.jpg?v=1683744744&amp;width=352 352w" height="300">
<!-- With the height set to nil -->
<img src="//polinas-potent-potions.myshopify.com/cdn/shop/files/science-beakers-blue-light-new.jpg?v=1683744744&amp;width=400" alt="Health potion" srcset="//polinas-potent-potions.myshopify.com/cdn/shop/files/science-beakers-blue-light-new.jpg?v=1683744744&amp;width=352 352w">
code:
{{ product | image_url: width: 200 | image_tag: sizes: '(min-width:1600px) 960px, (min-width: 750px) calc((100vw - 11.5rem) / 2), calc(100vw - 4rem)' }}
data:
{}
output:
<img src="//polinas-potent-potions.myshopify.com/cdn/shop/files/science-beakers-blue-light-new.jpg?v=1683744744&amp;width=200" alt="Health potion" srcset="//polinas-potent-potions.myshopify.com/cdn/shop/files/science-beakers-blue-light-new.jpg?v=1683744744&amp;width=200 200w" width="200" height="133" sizes="(min-width:1600px) 960px, (min-width: 750px) calc((100vw - 11.5rem) / 2), calc(100vw - 4rem)">
code:
{{ product | image_url: width: 600 | image_tag: widths: '200, 300, 400' }}
data:
{}
output:
<img src="//polinas-potent-potions.myshopify.com/cdn/shop/files/science-beakers-blue-light-new.jpg?v=1683744744&amp;width=600" alt="Health potion" srcset="//polinas-potent-potions.myshopify.com/cdn/shop/files/science-beakers-blue-light-new.jpg?v=1683744744&amp;width=200 200w, //polinas-potent-potions.myshopify.com/cdn/shop/files/science-beakers-blue-light-new.jpg?v=1683744744&amp;width=300 300w, //polinas-potent-potions.myshopify.com/cdn/shop/files/science-beakers-blue-light-new.jpg?v=1683744744&amp;width=400 400w" width="600" height="400">
code:
{{ product | image_url: width: 200 | image_tag: srcset: nil }}
data:
{}
output:
<img src="//polinas-potent-potions.myshopify.com/cdn/shop/files/science-beakers-blue-light-new.jpg?v=1683744744&amp;width=200" alt="Health potion" width="200" height="133">
code:
data:
output:
code:
{{ product | image_url: width: 200 | image_tag: alt: "My image's alt text" }}
data:
{}
output:
<img src="//polinas-potent-potions.myshopify.com/cdn/shop/files/science-beakers-blue-light-new.jpg?v=1683744744&amp;width=200" alt="My image&#39;s alt text" srcset="//polinas-potent-potions.myshopify.com/cdn/shop/files/science-beakers-blue-light-new.jpg?v=1683744744&amp;width=200 200w" width="200" height="133">
code:
{{ product | image_url: width: 200 | image_tag: class: 'custom-class', loading: 'lazy' }}
data:
{}
output:
<img src="//polinas-potent-potions.myshopify.com/cdn/shop/files/science-beakers-blue-light-new.jpg?v=1683744744&amp;width=200" alt="Health potion" srcset="//polinas-potent-potions.myshopify.com/cdn/shop/files/science-beakers-blue-light-new.jpg?v=1683744744&amp;width=200 200w" width="200" height="133" loading="lazy" class="custom-class">
Deprecated: false
variable | image_url: width: number, height: number
Returns the [CDN URL](/themes/best-practices/performance/platform#shopify-cdn) for an image.
code:
{{ product | image_url: width: 450 }}
data:
{}
output:
//polinas-potent-potions.myshopify.com/cdn/shop/files/science-beakers-blue-light-new.jpg?v=1683744744&width=450
code:
{{ product | image_url: width: 450 }}
data:
{}
output:
//polinas-potent-potions.myshopify.com/cdn/shop/files/science-beakers-blue-light-new.jpg?v=1683744744&width=450
code:
{{ product | image_url: height: 450 }}
data:
{}
output:
//polinas-potent-potions.myshopify.com/cdn/shop/files/science-beakers-blue-light-new.jpg?height=450&v=1683744744
code:
{{ product | image_url: width: 400, height: 400, crop: 'bottom' }}
{{ product | image_url: crop: 'region', crop_left: 32, crop_top: 32, crop_width: 512, crop_height: 512 }}
{{ product | image_url: crop: 'region', width: 100, height: 100, crop_left: 32, crop_top: 32, crop_width: 512, crop_height: 512 }}
data:
{}
output:
//polinas-potent-potions.myshopify.com/cdn/shop/files/science-beakers-blue-light-new.jpg?crop=bottom&height=400&v=1683744744&width=400
//polinas-potent-potions.myshopify.com/cdn/shop/files/science-beakers-blue-light-new.jpg?crop=region&crop_height=512&crop_left=32&crop_top=32&crop_width=512&v=1683744744
//polinas-potent-potions.myshopify.com/cdn/shop/files/science-beakers-blue-light-new.jpg?crop=region&crop_height=512&crop_left=32&crop_top=32&crop_width=512&height=100&v=1683744744&width=100
code:
{{ product | image_url: width: 450, format: 'pjpg' }}
data:
{}
output:
//polinas-potent-potions.myshopify.com/cdn/shop/files/science-beakers-blue-light-new.jpg?format=pjpg&v=1683744744&width=450
code:
{{ product | image_url: width: 400, height: 400, pad_color: '000' }}
data:
{}
output:
//polinas-potent-potions.myshopify.com/cdn/shop/files/science-beakers-blue-light-new.jpg?height=400&pad_color=000&v=1683744744&width=400
Deprecated: true
string | img_tag
Generates an HTML `<img>` tag for a given image URL.
code:
{{ product | img_tag }}
data:
{}
output:
<img src="//polinas-potent-potions.myshopify.com/cdn/shop/files/science-beakers-blue-light-new_small.jpg?v=1683744744" alt="" />
code:
{{ product | img_tag: 'image alt text', '', '450x450' }}
data:
{}
output:
<img src="//polinas-potent-potions.myshopify.com/cdn/shop/files/science-beakers-blue-light-new_450x450.jpg?v=1683744744" alt="image alt text" class="" />
Deprecated: true
variable | img_url
Returns the [CDN URL](/themes/best-practices/performance/platform#shopify-cdn) for an image.
code:
{{ product | img_url }}
data:
{}
output:
//polinas-potent-potions.myshopify.com/cdn/shop/files/science-beakers-blue-light-new_small.jpg?v=1683744744
code:
{{ product | img_url: '480x' }}
{{ product | img_url: 'x480' }}
{{ product | img_url: '480x480' }}
{{ product | img_url: 'large' }}
data:
{}
output:
//polinas-potent-potions.myshopify.com/cdn/shop/files/science-beakers-blue-light-new_480x.jpg?v=1683744744
//polinas-potent-potions.myshopify.com/cdn/shop/files/science-beakers-blue-light-new_x480.jpg?v=1683744744
//polinas-potent-potions.myshopify.com/cdn/shop/files/science-beakers-blue-light-new_480x480.jpg?v=1683744744
//polinas-potent-potions.myshopify.com/cdn/shop/files/science-beakers-blue-light-new_large.jpg?v=1683744744
code:
{{ product | img_url: crop: 'bottom' }}
data:
{}
output:
//polinas-potent-potions.myshopify.com/cdn/shop/files/science-beakers-blue-light-new_small.jpg?v=1683744744
code:
{{ product | img_url: format: 'pjpg' }}
data:
{}
output:
//polinas-potent-potions.myshopify.com/cdn/shop/files/science-beakers-blue-light-new_small.jpg?v=1683744744
code:
{{ product | img_url: scale: 2 }}
data:
{}
output:
//polinas-potent-potions.myshopify.com/cdn/shop/files/science-beakers-blue-light-new_small.jpg?v=1683744744
Deprecated: false
media | media_tag
Generates an appropriate HTML tag for a given media object.
code:
{% for media in product.media %}
{{- media | media_tag }}
{% endfor %}
data:
{}
output:
<iframe frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen="allowfullscreen" src="https://www.youtube.com/embed/vj01PAffOac?controls=1&amp;enablejsapi=1&amp;modestbranding=1&amp;origin=https%3A%2F%2Fpolinas-potent-potions.myshopify.com&amp;playsinline=1&amp;rel=0" title="Potion beats"></iframe>
<video playsinline="playsinline" controls="controls" preload="metadata" aria-label="Potion beats" poster="//polinas-potent-potions.myshopify.com/cdn/shop/products/4edc28a708b7405093a927cebe794f1a.thumbnail.0000000_small.jpg?v=1655255324"><source src="//polinas-potent-potions.myshopify.com/cdn/shop/videos/c/vp/4edc28a708b7405093a927cebe794f1a/4edc28a708b7405093a927cebe794f1a.HD-1080p-7.2Mbps.mp4?v=0" type="video/mp4"><img src="//polinas-potent-potions.myshopify.com/cdn/shop/products/4edc28a708b7405093a927cebe794f1a.thumbnail.0000000_small.jpg?v=1655255324"></video>
code:
{% for media in product.media %}
{{- media | media_tag: image_size: '400x' }}
{% endfor %}
data:
{}
output:
<iframe frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen="allowfullscreen" image_size="400x" src="https://www.youtube.com/embed/vj01PAffOac?controls=1&amp;enablejsapi=1&amp;modestbranding=1&amp;origin=https%3A%2F%2Fpolinas-potent-potions.myshopify.com&amp;playsinline=1&amp;rel=0" title="Potion beats"></iframe>
<video playsinline="playsinline" controls="controls" preload="metadata" aria-label="Potion beats" poster="//polinas-potent-potions.myshopify.com/cdn/shop/products/4edc28a708b7405093a927cebe794f1a.thumbnail.0000000_400x.jpg?v=1655255324"><source src="//polinas-potent-potions.myshopify.com/cdn/shop/videos/c/vp/4edc28a708b7405093a927cebe794f1a/4edc28a708b7405093a927cebe794f1a.HD-1080p-7.2Mbps.mp4?v=0" type="video/mp4"><img src="//polinas-potent-potions.myshopify.com/cdn/shop/products/4edc28a708b7405093a927cebe794f1a.thumbnail.0000000_400x.jpg?v=1655255324"></video>
Deprecated: false
media | model_viewer_tag
Generates a [Google model viewer component](https://modelviewer.dev/) for a given 3D model.
code:
{% for media in product.media %}
{% if media.media_type == 'model' %}
{{ media | model_viewer_tag }}
{% endif %}
{% endfor %}
data:
{}
output:
<model-viewer src="//polinas-potent-potions.myshopify.com/cdn/shop/3d/models/o/eb9388299ce0557c/WaterBottle.glb?v=0" camera-controls="true" style="--poster-color: transparent;" data-shopify-feature="1.12" alt="Potion bottle" poster="//polinas-potent-potions.myshopify.com/cdn/shop/products/WaterBottle_small.jpg?v=1655189057"></model-viewer>
code:
{% for media in product.media %}
{% if media.media_type == 'model' %}
{{ media | model_viewer_tag: interaction-policy: 'allow-when-focused' }}
{% endif %}
{% endfor %}
data:
{}
output:
<model-viewer interaction-policy="allow-when-focused" src="//polinas-potent-potions.myshopify.com/cdn/shop/3d/models/o/eb9388299ce0557c/WaterBottle.glb?v=0" camera-controls="true" style="--poster-color: transparent;" data-shopify-feature="1.12" alt="Potion bottle" poster="//polinas-potent-potions.myshopify.com/cdn/shop/products/WaterBottle_small.jpg?v=1655189057"></model-viewer>
code:
{% for media in product.media %}
{% if media.media_type == 'model' %}
{{ media | model_viewer_tag: image_size: '400x' }}
{% endif %}
{% endfor %}
data:
{}
output:
<model-viewer src="//polinas-potent-potions.myshopify.com/cdn/shop/3d/models/o/eb9388299ce0557c/WaterBottle.glb?v=0" camera-controls="true" style="--poster-color: transparent;" data-shopify-feature="1.12" alt="Potion bottle" poster="//polinas-potent-potions.myshopify.com/cdn/shop/products/WaterBottle_400x.jpg?v=1655189057"></model-viewer>
Deprecated: true
variable | product_img_url
Returns the [CDN URL](/themes/best-practices/performance/platform#shopify-cdn) for a [product image](/docs/api/liquid/objects/product).
code:
{{ product.featured_image | product_img_url }}
data:
{"product":{"featured_image":"files/science-beakers-blue-light-new.jpg"}}
output:
//polinas-potent-potions.myshopify.com/cdn/shop/files/science-beakers-blue-light-new_small.jpg?v=1683744744
code:
{{ product.images[0] | product_img_url: 'large' }}
data:
{"product":{"images":["files/science-beakers-blue-light-new.jpg","products/science-beakers-blue-light.jpg","files/science-beakers-blue-light_9c5badcd-ea54-4ddc-916c-a45c6c67c704.jpg","files/science-beakers-blue-light_40984233-47bf-4b8b-844c-88020e3da712.jpg"]}}
output:
//polinas-potent-potions.myshopify.com/cdn/shop/files/science-beakers-blue-light-new_large.jpg?v=1683744744
Deprecated: false
media | video_tag
Generates an HTML `<video>` tag for a given video.
code:
{% for media in product.media %}
{% if media.media_type == 'video' %}
{{ media | video_tag }}
{% endif %}
{% endfor %}
data:
{}
output:
<video playsinline="playsinline" preload="metadata" aria-label="Potion beats" poster="//polinas-potent-potions.myshopify.com/cdn/shop/products/4edc28a708b7405093a927cebe794f1a.thumbnail.0000000_small.jpg?v=1655255324"><source src="//polinas-potent-potions.myshopify.com/cdn/shop/videos/c/vp/4edc28a708b7405093a927cebe794f1a/4edc28a708b7405093a927cebe794f1a.HD-1080p-7.2Mbps.mp4?v=0" type="video/mp4"><img src="//polinas-potent-potions.myshopify.com/cdn/shop/products/4edc28a708b7405093a927cebe794f1a.thumbnail.0000000_small.jpg?v=1655255324"></video>
code:
{% for media in product.media %}
{% if media.media_type == 'video' %}
{{ media | video_tag: image_size: '400x' }}
{% endif %}
{% endfor %}
data:
{}
output:
<video playsinline="playsinline" preload="metadata" aria-label="Potion beats" poster="//polinas-potent-potions.myshopify.com/cdn/shop/products/4edc28a708b7405093a927cebe794f1a.thumbnail.0000000_400x.jpg?v=1655255324"><source src="//polinas-potent-potions.myshopify.com/cdn/shop/videos/c/vp/4edc28a708b7405093a927cebe794f1a/4edc28a708b7405093a927cebe794f1a.HD-1080p-7.2Mbps.mp4?v=0" type="video/mp4"><img src="//polinas-potent-potions.myshopify.com/cdn/shop/products/4edc28a708b7405093a927cebe794f1a.thumbnail.0000000_400x.jpg?v=1655255324"></video>
code:
{% for media in product.media %}
{% if media.media_type == 'video' %}
{{ media | video_tag: autoplay: true, loop: true, muted: true, controls: true }}
{% endif %}
{% endfor %}
data:
{}
output:
<video playsinline="playsinline" autoplay="autoplay" loop="loop" muted="muted" controls="controls" preload="metadata" aria-label="Potion beats" poster="//polinas-potent-potions.myshopify.com/cdn/shop/products/4edc28a708b7405093a927cebe794f1a.thumbnail.0000000_small.jpg?v=1655255324"><source src="//polinas-potent-potions.myshopify.com/cdn/shop/videos/c/vp/4edc28a708b7405093a927cebe794f1a/4edc28a708b7405093a927cebe794f1a.HD-1080p-7.2Mbps.mp4?v=0" type="video/mp4"><img src="//polinas-potent-potions.myshopify.com/cdn/shop/products/4edc28a708b7405093a927cebe794f1a.thumbnail.0000000_small.jpg?v=1655255324"></video>
Metafield filters output metafield data from a [`metafield` object](/docs/api/liquid/objects/metafield) within a relevant HTML element, or as a plain string.
Deprecated: false
metafield | metafield_tag
Generates an HTML element to host the metafield data. The type of element that's generated differs depending on the type of metafield.
code:
<!-- boolean -->
{{ product.metafields.information.seasonal | metafield_tag }}
<!-- collection_reference -->
{{ product.metafields.information.related_collection | metafield_tag }}
<!-- color -->
{{ product.metafields.details.potion_color | metafield_tag }}
<!-- date -->
{{ product.metafields.information.expiry | metafield_tag }}
<!-- date_time -->
{{ product.metafields.information.brew_date | metafield_tag }}
<!-- json -->
{{ product.metafields.information.burn_temperature | metafield_tag }}
<!-- money -->
{{ product.metafields.details.price_per_ml | metafield_tag }}
<!-- multi_line_text_field -->
{{ product.metafields.information.shipping | metafield_tag }}
<!-- number_decimal -->
{{ product.metafields.information.salinity | metafield_tag }}
<!-- number_integer -->
{{ product.metafields.information.doses_per_day | metafield_tag }}
<!-- page_reference -->
{{ product.metafields.information.dosage | metafield_tag }}
<!-- product_reference -->
{{ product.metafields.information.related_product | metafield_tag }}
<!-- rating -->
{{ product.metafields.details.rating | metafield_tag }}
<!-- single_line_text_field -->
{{ product.metafields.information.directions | metafield_tag }}
<!-- url -->
{{ product.metafields.information.health | metafield_tag }}
<!-- variant_reference -->
{{ product.metafields.information.best_seller | metafield_tag }}
<!-- rich_text_field -->
{{ product.metafields.information.rich_description | metafield_tag }}
data:
{}
output:
<!-- boolean -->
<span class="metafield-boolean">false</span>
<!-- collection_reference -->
<a href="/collections/sale-potions" class="metafield-collection_reference">Sale potions</a>
<!-- color -->
<span class="metafield-color">#ff0000</span>
<!-- date -->
<time datetime="2040-01-01" class="metafield-date">January 1, 2040</time>
<!-- date_time -->
<time datetime="2022-06-22T13:00:00Z" class="metafield-date_time">Jun 22, 2022, 1:00 pm</time>
<!-- json -->
<script type="application/json" class="metafield-json">{"temperature":"700","unit":"degrees","scale":"Fahrenheit"}</script>
<!-- money -->
<span class="metafield-money">$0.10 CAD</span>
<!-- multi_line_text_field -->
<span class="metafield-multi_line_text_field">All health potions are made to order, so it might take up to 2 weeks before your order can be shipped.<br />
<br />
Thanks for your patience!</span>
<!-- number_decimal -->
<span class="metafield-number_decimal">8.4</span>
<!-- number_integer -->
<span class="metafield-number_integer">3</span>
<!-- page_reference -->
<a href="/pages/potion-dosages" class="metafield-page_reference">Potion dosages</a>
<!-- product_reference -->
<a href="/products/dried-chamomile" class="metafield-product_reference">Dried chamomile</a>
<!-- rating -->
<span class="metafield-rating">4.5</span>
<!-- single_line_text_field -->
<span class="metafield-single_line_text_field">Take with a meal.</span>
<!-- url -->
<a href="https://www.canada.ca/en/health-canada/services/food-nutrition/legislation-guidelines/acts-regulations/canada-food-drugs.html" class="metafield-url">www.canada.ca/en/health-canada/services/food-nutrition/legislation-guidelines/acts-regulations/canada-food-drugs.html</a>
<!-- variant_reference -->
<a href="/products/health-potion?variant=39897499762753" class="metafield-variant_reference">S / Medium</a>
<!-- rich_text_field -->
<div class="metafield-rich_text_field"><h3>Are you low on health? Well we&#39;ve got the potion just for you!</h3><p>Just need a top up? Almost dead? In between? No need to worry because we have a range of sizes and strengths!</p></div>
code:
data:
{}
output:
code:
{{ product.metafields.details.scale_width | metafield_tag }}
data:
{}
output:
<span class="metafield-dimension"><span class="metafield-dimension_value">3 </span><span class="metafield-dimension_unit">cm</span></span>
code:
<!-- Image -->
{{ product.metafields.information.promo_image | metafield_tag }}
<!-- Video -->
{{ product.metafields.information.promo_video | metafield_tag }}
<!-- Other -->
{{ product.metafields.information.disclaimers | metafield_tag }}
data:
{}
output:
<!-- Image -->
<img src="//polinas-potent-potions.myshopify.com/cdn/shop/files/potions-header.png?v=1650325393" loading="lazy" class="metafield-file_reference">
<!-- Video -->
<video playsinline="playsinline" preload="metadata" poster="//polinas-potent-potions.myshopify.com/cdn/shop/files/preview_images/4733c31cd9d744f6994f61458fda85e6.thumbnail.0000000_small.jpg?v=1655257099"><source src="//polinas-potent-potions.myshopify.com/cdn/shop/videos/c/vp/4733c31cd9d744f6994f61458fda85e6/4733c31cd9d744f6994f61458fda85e6.HD-1080p-7.2Mbps.mp4?v=0" type="video/mp4"><img src="//polinas-potent-potions.myshopify.com/cdn/shop/files/preview_images/4733c31cd9d744f6994f61458fda85e6.thumbnail.0000000_small.jpg?v=1655257099"></video>
<!-- Other -->
<a href="//polinas-potent-potions.myshopify.com/cdn/shop/files/disclaimer.pdf?v=9043651738044769859" class="metafield-file_reference"><img src="//polinas-potent-potions.myshopify.com/cdn/shop/files/preview_images/document-7f23220eb4be7eeaa6e225738b97d943f22e74367cd2d7544fc3b37fb36acd71.png?v=1653087800" loading="lazy"></a>
code:
<!-- <ul> element -->
{{ product.metafields.information.ingredients | metafield_tag: field: 'name' }}
<!-- <ol> element -->
{{ product.metafields.information.ingredients | metafield_tag: field: 'name', list_format: 'ordered' }}
data:
{}
output:
<!-- <ul> element -->
<ul class="metafield-single_line_text_field-array"><li class="metafield-single_line_text_field">Spinach</li><li class="metafield-single_line_text_field">Kale</li><li class="metafield-single_line_text_field">Mushrooms</li></ul>
<!-- <ol> element -->
<ol class="metafield-single_line_text_field-array"><li class="metafield-single_line_text_field">Spinach</li><li class="metafield-single_line_text_field">Kale</li><li class="metafield-single_line_text_field">Mushrooms</li></ol>
code:
<!-- <ul> element -->
{{ product.metafields.information.pickup_locations | metafield_tag }}
<!-- <ol> element -->
{{ product.metafields.information.pickup_locations | metafield_tag: list_format: 'ordered' }}
data:
{}
output:
<!-- <ul> element -->
<ul class="metafield-single_line_text_field-array"><li class="metafield-single_line_text_field">Ottawa</li><li class="metafield-single_line_text_field">Toronto</li><li class="metafield-single_line_text_field">Montreal</li><li class="metafield-single_line_text_field">Vancouver</li></ul>
<!-- <ol> element -->
<ol class="metafield-single_line_text_field-array"><li class="metafield-single_line_text_field">Ottawa</li><li class="metafield-single_line_text_field">Toronto</li><li class="metafield-single_line_text_field">Montreal</li><li class="metafield-single_line_text_field">Vancouver</li></ol>
code:
{{ product.metafields.information.primary_ingredient | metafield_tag: field: 'name' }}
data:
{}
output:
<span class="metafield-single_line_text_field">Spinach</span>
code:
{{ product.metafields.details.milk_container_volume | metafield_tag }}
data:
{}
output:
<span class="metafield-volume"><span class="metafield-volume_value">500 </span><span class="metafield-volume_unit">mL</span></span>
code:
{{ product.metafields.details.chamomile_base_weight | metafield_tag }}
data:
{}
output:
<span class="metafield-weight"><span class="metafield-weight_value">50 </span><span class="metafield-weight_unit">g</span></span>
Deprecated: false
metafield | metafield_text
Generates a text version of the metafield data.
code:
{{ product.metafields.information.dosage | metafield_text }}
data:
{}
output:
Potion dosages
code:
data:
{}
output:
code:
{{ product.metafields.information.ingredients | metafield_text: field: 'name' }}
data:
{}
output:
Spinach, Kale, and Mushrooms
code:
{{ product.metafields.information.primary_ingredient | metafield_tag: field: 'name' }}
data:
{}
output:
<span class="metafield-single_line_text_field">Spinach</span>
Money filters format prices based on the [currency formatting](https://help.shopify.com/manual/payments/currency-formatting) that's defined in the Shopify admin.
Deprecated: false
number | money
Formats a given price based on the store's [**HTML without currency** setting](https://help.shopify.com/manual/payments/currency-formatting).
code:
{{ product.price | money }}
data:
{"product":{"price":"10.00"}}
output:
$10.00
Deprecated: false
number | money_with_currency
Formats a given price based on the store's [**HTML with currency** setting](https://help.shopify.com/manual/payments/currency-formatting).
code:
{{ product.price | money_with_currency }}
data:
{"product":{"price":"10.00"}}
output:
$10.00 CAD
Deprecated: false
number | money_without_currency
Formats a given price based on the store's [**HTML without currency** setting](https://help.shopify.com/manual/payments/currency-formatting), without the currency symbol.
code:
{{ product.price | money_without_currency }}
data:
{"product":{"price":"10.00"}}
output:
10.00
Deprecated: false
number | money_without_trailing_zeros
Formats a given price based on the store's [**HTML without currency** setting](https://help.shopify.com/manual/payments/currency-formatting), excluding the decimal separator (either `.` or `,`) and trailing zeros. If the price has a non-zero decimal value, then the output is the same as the [`money` filter](/docs/api/liquid/filters#money).
code:
{{ product.price | money_without_trailing_zeros }}
data:
{"product":{"price":"10.00"}}
output:
$10
Payment filters output content related to the store’s payment options.
Deprecated: false
form | payment_button
Generates an HTML container to host [accelerated checkout buttons](https://help.shopify.com/manual/online-store/dynamic-checkout) for a product. The `payment_button` filter must be used on the `form` object within a [product form](/docs/api/liquid/tags/form#form-product).
Deprecated: false
form | payment_terms
Generates the HTML for the [Shop Pay Installments banner](/themes/pricing-payments/installments).
Deprecated: false
string | payment_type_img_url
Returns the URL for an SVG image of a given [payment type](/docs/api/liquid/objects/shop#shop-enabled_payment_types).
code:
{% for type in shop.enabled_payment_types %}
<img src="{{ type | payment_type_img_url }}" width="50" height="50" />
{% endfor %}
data:
{"shop":{"enabled_payment_types":["american_express","apple_pay","diners_club","discover","google_pay","master","paypal","shopify_pay","visa"]}}
output:
<img src="//polinas-potent-potions.myshopify.com/cdn/shopifycloud/shopify/assets/payment_icons/american_express-12858714bc10cdf384b62b8f41d20f56d8c32c1b8fed98b662f2bfc158dcbcf0.svg" width="50" height="50" />
<img src="//polinas-potent-potions.myshopify.com/cdn/shopifycloud/shopify/assets/payment_icons/apple_pay-f6db0077dc7c325b436ecbdcf254239100b35b70b1663bc7523d7c424901fa09.svg" width="50" height="50" />
<img src="//polinas-potent-potions.myshopify.com/cdn/shopifycloud/shopify/assets/payment_icons/diners_club-16436b9fb6dd9060edb51f1c7c44e23941e544ad798282d6aef1604319562fba.svg" width="50" height="50" />
<img src="//polinas-potent-potions.myshopify.com/cdn/shopifycloud/shopify/assets/payment_icons/discover-cc9808e50193c7496e7a5245eb86d5e06f02e2476c0fe70f2c40016707d35461.svg" width="50" height="50" />
<img src="//polinas-potent-potions.myshopify.com/cdn/shopifycloud/shopify/assets/payment_icons/google_pay-c66a29c63facf2053bf69352982c958e9675cabea4f2f7ccec08d169d1856b31.svg" width="50" height="50" />
<img src="//polinas-potent-potions.myshopify.com/cdn/shopifycloud/shopify/assets/payment_icons/master-173035bc8124581983d4efa50cf8626e8553c2b311353fbf67485f9c1a2b88d1.svg" width="50" height="50" />
<img src="//polinas-potent-potions.myshopify.com/cdn/shopifycloud/shopify/assets/payment_icons/paypal-49e4c1e03244b6d2de0d270ca0d22dd15da6e92cc7266e93eb43762df5aa355d.svg" width="50" height="50" />
<img src="//polinas-potent-potions.myshopify.com/cdn/shopifycloud/shopify/assets/payment_icons/shopify_pay-957a48d1202dc65a7890b292de764ee886f7e64cea486ae82e291e9dc824c914.svg" width="50" height="50" />
<img src="//polinas-potent-potions.myshopify.com/cdn/shopifycloud/shopify/assets/payment_icons/visa-319d545c6fd255c9aad5eeaad21fd6f7f7b4fdbdb1a35ce83b89cca12a187f00.svg" width="50" height="50" />
Deprecated: false
string | payment_type_svg_tag
Generates an HTML `<svg>` tag for a given [payment type](/docs/api/liquid/objects/shop#shop-enabled_payment_types).
code:
{% for type in shop.enabled_payment_types -%}
{{ type | payment_type_svg_tag }}
{% endfor %}
data:
{"shop":{"enabled_payment_types":["american_express","apple_pay","diners_club","discover","google_pay","master","paypal","shopify_pay","visa"]}}
output:
<svg xmlns="http://www.w3.org/2000/svg" role="img" aria-labelledby="pi-american_express" viewBox="0 0 38 24" width="38" height="24"><title id="pi-american_express">American Express</title><path fill="#000" d="M35 0H3C1.3 0 0 1.3 0 3v18c0 1.7 1.4 3 3 3h32c1.7 0 3-1.3 3-3V3c0-1.7-1.4-3-3-3Z" opacity=".07"/><path fill="#006FCF" d="M35 1c1.1 0 2 .9 2 2v18c0 1.1-.9 2-2 2H3c-1.1 0-2-.9-2-2V3c0-1.1.9-2 2-2h32Z"/><path fill="#FFF" d="M22.012 19.936v-8.421L37 11.528v2.326l-1.732 1.852L37 17.573v2.375h-2.766l-1.47-1.622-1.46 1.628-9.292-.02Z"/><path fill="#006FCF" d="M23.013 19.012v-6.57h5.572v1.513h-3.768v1.028h3.678v1.488h-3.678v1.01h3.768v1.531h-5.572Z"/><path fill="#006FCF" d="m28.557 19.012 3.083-3.289-3.083-3.282h2.386l1.884 2.083 1.89-2.082H37v.051l-3.017 3.23L37 18.92v.093h-2.307l-1.917-2.103-1.898 2.104h-2.321Z"/><path fill="#FFF" d="M22.71 4.04h3.614l1.269 2.881V4.04h4.46l.77 2.159.771-2.159H37v8.421H19l3.71-8.421Z"/><path fill="#006FCF" d="m23.395 4.955-2.916 6.566h2l.55-1.315h2.98l.55 1.315h2.05l-2.904-6.566h-2.31Zm.25 3.777.875-2.09.873 2.09h-1.748Z"/><path fill="#006FCF" d="M28.581 11.52V4.953l2.811.01L32.84 9l1.456-4.046H37v6.565l-1.74.016v-4.51l-1.644 4.494h-1.59L30.35 7.01v4.51h-1.768Z"/></svg>
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" role="img" x="0" y="0" width="38" height="24" viewBox="0 0 165.521 105.965" xml:space="preserve" aria-labelledby="pi-apple_pay"><title id="pi-apple_pay">Apple Pay</title><path fill="#000" d="M150.698 0H14.823c-.566 0-1.133 0-1.698.003-.477.004-.953.009-1.43.022-1.039.028-2.087.09-3.113.274a10.51 10.51 0 0 0-2.958.975 9.932 9.932 0 0 0-4.35 4.35 10.463 10.463 0 0 0-.975 2.96C.113 9.611.052 10.658.024 11.696a70.22 70.22 0 0 0-.022 1.43C0 13.69 0 14.256 0 14.823v76.318c0 .567 0 1.132.002 1.699.003.476.009.953.022 1.43.028 1.036.09 2.084.275 3.11a10.46 10.46 0 0 0 .974 2.96 9.897 9.897 0 0 0 1.83 2.52 9.874 9.874 0 0 0 2.52 1.83c.947.483 1.917.79 2.96.977 1.025.183 2.073.245 3.112.273.477.011.953.017 1.43.02.565.004 1.132.004 1.698.004h135.875c.565 0 1.132 0 1.697-.004.476-.002.952-.009 1.431-.02 1.037-.028 2.085-.09 3.113-.273a10.478 10.478 0 0 0 2.958-.977 9.955 9.955 0 0 0 4.35-4.35c.483-.947.789-1.917.974-2.96.186-1.026.246-2.074.274-3.11.013-.477.02-.954.022-1.43.004-.567.004-1.132.004-1.699V14.824c0-.567 0-1.133-.004-1.699a63.067 63.067 0 0 0-.022-1.429c-.028-1.038-.088-2.085-.274-3.112a10.4 10.4 0 0 0-.974-2.96 9.94 9.94 0 0 0-4.35-4.35A10.52 10.52 0 0 0 156.939.3c-1.028-.185-2.076-.246-3.113-.274a71.417 71.417 0 0 0-1.431-.022C151.83 0 151.263 0 150.698 0z" /><path fill="#FFF" d="M150.698 3.532l1.672.003c.452.003.905.008 1.36.02.793.022 1.719.065 2.583.22.75.135 1.38.34 1.984.648a6.392 6.392 0 0 1 2.804 2.807c.306.6.51 1.226.645 1.983.154.854.197 1.783.218 2.58.013.45.019.9.02 1.36.005.557.005 1.113.005 1.671v76.318c0 .558 0 1.114-.004 1.682-.002.45-.008.9-.02 1.35-.022.796-.065 1.725-.221 2.589a6.855 6.855 0 0 1-.645 1.975 6.397 6.397 0 0 1-2.808 2.807c-.6.306-1.228.511-1.971.645-.881.157-1.847.2-2.574.22-.457.01-.912.017-1.379.019-.555.004-1.113.004-1.669.004H14.801c-.55 0-1.1 0-1.66-.004a74.993 74.993 0 0 1-1.35-.018c-.744-.02-1.71-.064-2.584-.22a6.938 6.938 0 0 1-1.986-.65 6.337 6.337 0 0 1-1.622-1.18 6.355 6.355 0 0 1-1.178-1.623 6.935 6.935 0 0 1-.646-1.985c-.156-.863-.2-1.788-.22-2.578a66.088 66.088 0 0 1-.02-1.355l-.003-1.327V14.474l.002-1.325a66.7 66.7 0 0 1 .02-1.357c.022-.792.065-1.717.222-2.587a6.924 6.924 0 0 1 .646-1.981c.304-.598.7-1.144 1.18-1.623a6.386 6.386 0 0 1 1.624-1.18 6.96 6.96 0 0 1 1.98-.646c.865-.155 1.792-.198 2.586-.22.452-.012.905-.017 1.354-.02l1.677-.003h135.875" /><g><g><path fill="#000" d="M43.508 35.77c1.404-1.755 2.356-4.112 2.105-6.52-2.054.102-4.56 1.355-6.012 3.112-1.303 1.504-2.456 3.959-2.156 6.266 2.306.2 4.61-1.152 6.063-2.858" /><path fill="#000" d="M45.587 39.079c-3.35-.2-6.196 1.9-7.795 1.9-1.6 0-4.049-1.8-6.698-1.751-3.447.05-6.645 2-8.395 5.1-3.598 6.2-.95 15.4 2.55 20.45 1.699 2.5 3.747 5.25 6.445 5.151 2.55-.1 3.549-1.65 6.647-1.65 3.097 0 3.997 1.65 6.696 1.6 2.798-.05 4.548-2.5 6.247-5 1.95-2.85 2.747-5.6 2.797-5.75-.05-.05-5.396-2.101-5.446-8.251-.05-5.15 4.198-7.6 4.398-7.751-2.399-3.548-6.147-3.948-7.447-4.048" /></g><g><path fill="#000" d="M78.973 32.11c7.278 0 12.347 5.017 12.347 12.321 0 7.33-5.173 12.373-12.529 12.373h-8.058V69.62h-5.822V32.11h14.062zm-8.24 19.807h6.68c5.07 0 7.954-2.729 7.954-7.46 0-4.73-2.885-7.434-7.928-7.434h-6.706v14.894z" /><path fill="#000" d="M92.764 61.847c0-4.809 3.665-7.564 10.423-7.98l7.252-.442v-2.08c0-3.04-2.001-4.704-5.562-4.704-2.938 0-5.07 1.507-5.51 3.82h-5.252c.157-4.86 4.731-8.395 10.918-8.395 6.654 0 10.995 3.483 10.995 8.89v18.663h-5.38v-4.497h-.13c-1.534 2.937-4.914 4.782-8.579 4.782-5.406 0-9.175-3.222-9.175-8.057zm17.675-2.417v-2.106l-6.472.416c-3.64.234-5.536 1.585-5.536 3.95 0 2.288 1.975 3.77 5.068 3.77 3.95 0 6.94-2.522 6.94-6.03z" /><path fill="#000" d="M120.975 79.652v-4.496c.364.051 1.247.103 1.715.103 2.573 0 4.029-1.09 4.913-3.899l.52-1.663-9.852-27.293h6.082l6.863 22.146h.13l6.862-22.146h5.927l-10.216 28.67c-2.34 6.577-5.017 8.735-10.683 8.735-.442 0-1.872-.052-2.261-.157z" /></g></g></svg>
<svg viewBox="0 0 38 24" xmlns="http://www.w3.org/2000/svg" role="img" width="38" height="24" aria-labelledby="pi-diners_club"><title id="pi-diners_club">Diners Club</title><path opacity=".07" d="M35 0H3C1.3 0 0 1.3 0 3v18c0 1.7 1.4 3 3 3h32c1.7 0 3-1.3 3-3V3c0-1.7-1.4-3-3-3z"/><path fill="#fff" d="M35 1c1.1 0 2 .9 2 2v18c0 1.1-.9 2-2 2H3c-1.1 0-2-.9-2-2V3c0-1.1.9-2 2-2h32"/><path d="M12 12v3.7c0 .3-.2.3-.5.2-1.9-.8-3-3.3-2.3-5.4.4-1.1 1.2-2 2.3-2.4.4-.2.5-.1.5.2V12zm2 0V8.3c0-.3 0-.3.3-.2 2.1.8 3.2 3.3 2.4 5.4-.4 1.1-1.2 2-2.3 2.4-.4.2-.4.1-.4-.2V12zm7.2-7H13c3.8 0 6.8 3.1 6.8 7s-3 7-6.8 7h8.2c3.8 0 6.8-3.1 6.8-7s-3-7-6.8-7z" fill="#3086C8"/></svg>
<svg viewBox="0 0 38 24" width="38" height="24" role="img" aria-labelledby="pi-discover" fill="none" xmlns="http://www.w3.org/2000/svg"><title id="pi-discover">Discover</title><path fill="#000" opacity=".07" d="M35 0H3C1.3 0 0 1.3 0 3v18c0 1.7 1.4 3 3 3h32c1.7 0 3-1.3 3-3V3c0-1.7-1.4-3-3-3z"/><path d="M35 1c1.1 0 2 .9 2 2v18c0 1.1-.9 2-2 2H3c-1.1 0-2-.9-2-2V3c0-1.1.9-2 2-2h32z" fill="#fff"/><path d="M3.57 7.16H2v5.5h1.57c.83 0 1.43-.2 1.96-.63.63-.52 1-1.3 1-2.11-.01-1.63-1.22-2.76-2.96-2.76zm1.26 4.14c-.34.3-.77.44-1.47.44h-.29V8.1h.29c.69 0 1.11.12 1.47.44.37.33.59.84.59 1.37 0 .53-.22 1.06-.59 1.39zm2.19-4.14h1.07v5.5H7.02v-5.5zm3.69 2.11c-.64-.24-.83-.4-.83-.69 0-.35.34-.61.8-.61.32 0 .59.13.86.45l.56-.73c-.46-.4-1.01-.61-1.62-.61-.97 0-1.72.68-1.72 1.58 0 .76.35 1.15 1.35 1.51.42.15.63.25.74.31.21.14.32.34.32.57 0 .45-.35.78-.83.78-.51 0-.92-.26-1.17-.73l-.69.67c.49.73 1.09 1.05 1.9 1.05 1.11 0 1.9-.74 1.9-1.81.02-.89-.35-1.29-1.57-1.74zm1.92.65c0 1.62 1.27 2.87 2.9 2.87.46 0 .86-.09 1.34-.32v-1.26c-.43.43-.81.6-1.29.6-1.08 0-1.85-.78-1.85-1.9 0-1.06.79-1.89 1.8-1.89.51 0 .9.18 1.34.62V7.38c-.47-.24-.86-.34-1.32-.34-1.61 0-2.92 1.28-2.92 2.88zm12.76.94l-1.47-3.7h-1.17l2.33 5.64h.58l2.37-5.64h-1.16l-1.48 3.7zm3.13 1.8h3.04v-.93h-1.97v-1.48h1.9v-.93h-1.9V8.1h1.97v-.94h-3.04v5.5zm7.29-3.87c0-1.03-.71-1.62-1.95-1.62h-1.59v5.5h1.07v-2.21h.14l1.48 2.21h1.32l-1.73-2.32c.81-.17 1.26-.72 1.26-1.56zm-2.16.91h-.31V8.03h.33c.67 0 1.03.28 1.03.82 0 .55-.36.85-1.05.85z" fill="#231F20"/><path d="M20.16 12.86a2.931 2.931 0 100-5.862 2.931 2.931 0 000 5.862z" fill="url(#pi-paint0_linear)"/><path opacity=".65" d="M20.16 12.86a2.931 2.931 0 100-5.862 2.931 2.931 0 000 5.862z" fill="url(#pi-paint1_linear)"/><path d="M36.57 7.506c0-.1-.07-.15-.18-.15h-.16v.48h.12v-.19l.14.19h.14l-.16-.2c.06-.01.1-.06.1-.13zm-.2.07h-.02v-.13h.02c.06 0 .09.02.09.06 0 .05-.03.07-.09.07z" fill="#231F20"/><path d="M36.41 7.176c-.23 0-.42.19-.42.42 0 .23.19.42.42.42.23 0 .42-.19.42-.42 0-.23-.19-.42-.42-.42zm0 .77c-.18 0-.34-.15-.34-.35 0-.19.15-.35.34-.35.18 0 .33.16.33.35 0 .19-.15.35-.33.35z" fill="#231F20"/><path d="M37 12.984S27.09 19.873 8.976 23h26.023a2 2 0 002-1.984l.024-3.02L37 12.985z" fill="#F48120"/><defs><linearGradient id="pi-paint0_linear" x1="21.657" y1="12.275" x2="19.632" y2="9.104" gradientUnits="userSpaceOnUse"><stop stop-color="#F89F20"/><stop offset=".25" stop-color="#F79A20"/><stop offset=".533" stop-color="#F68D20"/><stop offset=".62" stop-color="#F58720"/><stop offset=".723" stop-color="#F48120"/><stop offset="1" stop-color="#F37521"/></linearGradient><linearGradient id="pi-paint1_linear" x1="21.338" y1="12.232" x2="18.378" y2="6.446" gradientUnits="userSpaceOnUse"><stop stop-color="#F58720"/><stop offset=".359" stop-color="#E16F27"/><stop offset=".703" stop-color="#D4602C"/><stop offset=".982" stop-color="#D05B2E"/></linearGradient></defs></svg>
<svg xmlns="http://www.w3.org/2000/svg" role="img" viewBox="0 0 38 24" width="38" height="24" aria-labelledby="pi-google_pay"><title id="pi-google_pay">Google Pay</title><path d="M35 0H3C1.3 0 0 1.3 0 3v18c0 1.7 1.4 3 3 3h32c1.7 0 3-1.3 3-3V3c0-1.7-1.4-3-3-3z" fill="#000" opacity=".07"/><path d="M35 1c1.1 0 2 .9 2 2v18c0 1.1-.9 2-2 2H3c-1.1 0-2-.9-2-2V3c0-1.1.9-2 2-2h32" fill="#FFF"/><path d="M18.093 11.976v3.2h-1.018v-7.9h2.691a2.447 2.447 0 0 1 1.747.692 2.28 2.28 0 0 1 .11 3.224l-.11.116c-.47.447-1.098.69-1.747.674l-1.673-.006zm0-3.732v2.788h1.698c.377.012.741-.135 1.005-.404a1.391 1.391 0 0 0-1.005-2.354l-1.698-.03zm6.484 1.348c.65-.03 1.286.188 1.778.613.445.43.682 1.03.65 1.649v3.334h-.969v-.766h-.049a1.93 1.93 0 0 1-1.673.931 2.17 2.17 0 0 1-1.496-.533 1.667 1.667 0 0 1-.613-1.324 1.606 1.606 0 0 1 .613-1.336 2.746 2.746 0 0 1 1.698-.515c.517-.02 1.03.093 1.49.331v-.208a1.134 1.134 0 0 0-.417-.901 1.416 1.416 0 0 0-.98-.368 1.545 1.545 0 0 0-1.319.717l-.895-.564a2.488 2.488 0 0 1 2.182-1.06zM23.29 13.52a.79.79 0 0 0 .337.662c.223.176.5.269.785.263.429-.001.84-.17 1.146-.472.305-.286.478-.685.478-1.103a2.047 2.047 0 0 0-1.324-.374 1.716 1.716 0 0 0-1.03.294.883.883 0 0 0-.392.73zm9.286-3.75l-3.39 7.79h-1.048l1.281-2.728-2.224-5.062h1.103l1.612 3.885 1.569-3.885h1.097z" fill="#5F6368"/><path d="M13.986 11.284c0-.308-.024-.616-.073-.92h-4.29v1.747h2.451a2.096 2.096 0 0 1-.9 1.373v1.134h1.464a4.433 4.433 0 0 0 1.348-3.334z" fill="#4285F4"/><path d="M9.629 15.721a4.352 4.352 0 0 0 3.01-1.097l-1.466-1.14a2.752 2.752 0 0 1-4.094-1.44H5.577v1.17a4.53 4.53 0 0 0 4.052 2.507z" fill="#34A853"/><path d="M7.079 12.05a2.709 2.709 0 0 1 0-1.735v-1.17H5.577a4.505 4.505 0 0 0 0 4.075l1.502-1.17z" fill="#FBBC04"/><path d="M9.629 8.44a2.452 2.452 0 0 1 1.74.68l1.3-1.293a4.37 4.37 0 0 0-3.065-1.183 4.53 4.53 0 0 0-4.027 2.5l1.502 1.171a2.715 2.715 0 0 1 2.55-1.875z" fill="#EA4335"/></svg>
<svg viewBox="0 0 38 24" xmlns="http://www.w3.org/2000/svg" role="img" width="38" height="24" aria-labelledby="pi-master"><title id="pi-master">Mastercard</title><path opacity=".07" d="M35 0H3C1.3 0 0 1.3 0 3v18c0 1.7 1.4 3 3 3h32c1.7 0 3-1.3 3-3V3c0-1.7-1.4-3-3-3z"/><path fill="#fff" d="M35 1c1.1 0 2 .9 2 2v18c0 1.1-.9 2-2 2H3c-1.1 0-2-.9-2-2V3c0-1.1.9-2 2-2h32"/><circle fill="#EB001B" cx="15" cy="12" r="7"/><circle fill="#F79E1B" cx="23" cy="12" r="7"/><path fill="#FF5F00" d="M22 12c0-2.4-1.2-4.5-3-5.7-1.8 1.3-3 3.4-3 5.7s1.2 4.5 3 5.7c1.8-1.2 3-3.3 3-5.7z"/></svg>
<svg viewBox="0 0 38 24" xmlns="http://www.w3.org/2000/svg" width="38" height="24" role="img" aria-labelledby="pi-paypal"><title id="pi-paypal">PayPal</title><path opacity=".07" d="M35 0H3C1.3 0 0 1.3 0 3v18c0 1.7 1.4 3 3 3h32c1.7 0 3-1.3 3-3V3c0-1.7-1.4-3-3-3z"/><path fill="#fff" d="M35 1c1.1 0 2 .9 2 2v18c0 1.1-.9 2-2 2H3c-1.1 0-2-.9-2-2V3c0-1.1.9-2 2-2h32"/><path fill="#003087" d="M23.9 8.3c.2-1 0-1.7-.6-2.3-.6-.7-1.7-1-3.1-1h-4.1c-.3 0-.5.2-.6.5L14 15.6c0 .2.1.4.3.4H17l.4-3.4 1.8-2.2 4.7-2.1z"/><path fill="#3086C8" d="M23.9 8.3l-.2.2c-.5 2.8-2.2 3.8-4.6 3.8H18c-.3 0-.5.2-.6.5l-.6 3.9-.2 1c0 .2.1.4.3.4H19c.3 0 .5-.2.5-.4v-.1l.4-2.4v-.1c0-.2.3-.4.5-.4h.3c2.1 0 3.7-.8 4.1-3.2.2-1 .1-1.8-.4-2.4-.1-.5-.3-.7-.5-.8z"/><path fill="#012169" d="M23.3 8.1c-.1-.1-.2-.1-.3-.1-.1 0-.2 0-.3-.1-.3-.1-.7-.1-1.1-.1h-3c-.1 0-.2 0-.2.1-.2.1-.3.2-.3.4l-.7 4.4v.1c0-.3.3-.5.6-.5h1.3c2.5 0 4.1-1 4.6-3.8v-.2c-.1-.1-.3-.2-.5-.2h-.1z"/></svg>
<svg xmlns="http://www.w3.org/2000/svg" role="img" viewBox="0 0 38 24" width="38" height="24" aria-labelledby="pi-shopify_pay"><title id="pi-shopify_pay">Shop Pay</title><path opacity=".07" d="M35 0H3C1.3 0 0 1.3 0 3v18c0 1.7 1.4 3 3 3h32c1.7 0 3-1.3 3-3V3c0-1.7-1.4-3-3-3z" fill="#000"/><path d="M35.889 0C37.05 0 38 .982 38 2.182v19.636c0 1.2-.95 2.182-2.111 2.182H2.11C.95 24 0 23.018 0 21.818V2.182C0 .982.95 0 2.111 0H35.89z" fill="#5A31F4"/><path d="M9.35 11.368c-1.017-.223-1.47-.31-1.47-.705 0-.372.306-.558.92-.558.54 0 .934.238 1.225.704a.079.079 0 00.104.03l1.146-.584a.082.082 0 00.032-.114c-.475-.831-1.353-1.286-2.51-1.286-1.52 0-2.464.755-2.464 1.956 0 1.275 1.15 1.597 2.17 1.82 1.02.222 1.474.31 1.474.705 0 .396-.332.582-.993.582-.612 0-1.065-.282-1.34-.83a.08.08 0 00-.107-.035l-1.143.57a.083.083 0 00-.036.111c.454.92 1.384 1.437 2.627 1.437 1.583 0 2.539-.742 2.539-1.98s-1.155-1.598-2.173-1.82v-.003zM15.49 8.855c-.65 0-1.224.232-1.636.646a.04.04 0 01-.069-.03v-2.64a.08.08 0 00-.08-.081H12.27a.08.08 0 00-.08.082v8.194a.08.08 0 00.08.082h1.433a.08.08 0 00.081-.082v-3.594c0-.695.528-1.227 1.239-1.227.71 0 1.226.521 1.226 1.227v3.594a.08.08 0 00.081.082h1.433a.08.08 0 00.081-.082v-3.594c0-1.51-.981-2.577-2.355-2.577zM20.753 8.62c-.778 0-1.507.24-2.03.588a.082.082 0 00-.027.109l.632 1.088a.08.08 0 00.11.03 2.5 2.5 0 011.318-.366c1.25 0 2.17.891 2.17 2.068 0 1.003-.736 1.745-1.669 1.745-.76 0-1.288-.446-1.288-1.077 0-.361.152-.657.548-.866a.08.08 0 00.032-.113l-.596-1.018a.08.08 0 00-.098-.035c-.799.299-1.359 1.018-1.359 1.984 0 1.46 1.152 2.55 2.76 2.55 1.877 0 3.227-1.313 3.227-3.195 0-2.018-1.57-3.492-3.73-3.492zM28.675 8.843c-.724 0-1.373.27-1.845.746-.026.027-.069.007-.069-.029v-.572a.08.08 0 00-.08-.082h-1.397a.08.08 0 00-.08.082v8.182a.08.08 0 00.08.081h1.433a.08.08 0 00.081-.081v-2.683c0-.036.043-.054.069-.03a2.6 2.6 0 001.808.7c1.682 0 2.993-1.373 2.993-3.157s-1.313-3.157-2.993-3.157zm-.271 4.929c-.956 0-1.681-.768-1.681-1.783s.723-1.783 1.681-1.783c.958 0 1.68.755 1.68 1.783 0 1.027-.713 1.783-1.681 1.783h.001z" fill="#fff"/></svg>
<svg viewBox="0 0 38 24" xmlns="http://www.w3.org/2000/svg" role="img" width="38" height="24" aria-labelledby="pi-visa"><title id="pi-visa">Visa</title><path opacity=".07" d="M35 0H3C1.3 0 0 1.3 0 3v18c0 1.7 1.4 3 3 3h32c1.7 0 3-1.3 3-3V3c0-1.7-1.4-3-3-3z"/><path fill="#fff" d="M35 1c1.1 0 2 .9 2 2v18c0 1.1-.9 2-2 2H3c-1.1 0-2-.9-2-2V3c0-1.1.9-2 2-2h32"/><path d="M28.3 10.1H28c-.4 1-.7 1.5-1 3h1.9c-.3-1.5-.3-2.2-.6-3zm2.9 5.9h-1.7c-.1 0-.1 0-.2-.1l-.2-.9-.1-.2h-2.4c-.1 0-.2 0-.2.2l-.3.9c0 .1-.1.1-.1.1h-2.1l.2-.5L27 8.7c0-.5.3-.7.8-.7h1.5c.1 0 .2 0 .2.2l1.4 6.5c.1.4.2.7.2 1.1.1.1.1.1.1.2zm-13.4-.3l.4-1.8c.1 0 .2.1.2.1.7.3 1.4.5 2.1.4.2 0 .5-.1.7-.2.5-.2.5-.7.1-1.1-.2-.2-.5-.3-.8-.5-.4-.2-.8-.4-1.1-.7-1.2-1-.8-2.4-.1-3.1.6-.4.9-.8 1.7-.8 1.2 0 2.5 0 3.1.2h.1c-.1.6-.2 1.1-.4 1.7-.5-.2-1-.4-1.5-.4-.3 0-.6 0-.9.1-.2 0-.3.1-.4.2-.2.2-.2.5 0 .7l.5.4c.4.2.8.4 1.1.6.5.3 1 .8 1.1 1.4.2.9-.1 1.7-.9 2.3-.5.4-.7.6-1.4.6-1.4 0-2.5.1-3.4-.2-.1.2-.1.2-.2.1zm-3.5.3c.1-.7.1-.7.2-1 .5-2.2 1-4.5 1.4-6.7.1-.2.1-.3.3-.3H18c-.2 1.2-.4 2.1-.7 3.2-.3 1.5-.6 3-1 4.5 0 .2-.1.2-.3.2M5 8.2c0-.1.2-.2.3-.2h3.4c.5 0 .9.3 1 .8l.9 4.4c0 .1 0 .1.1.2 0-.1.1-.1.1-.1l2.1-5.1c-.1-.1 0-.2.1-.2h2.1c0 .1 0 .1-.1.2l-3.1 7.3c-.1.2-.1.3-.2.4-.1.1-.3 0-.5 0H9.7c-.1 0-.2 0-.2-.2L7.9 9.5c-.2-.2-.5-.5-.9-.6-.6-.3-1.7-.5-1.9-.5L5 8.2z" fill="#142688"/></svg>
code:
{% for type in shop.enabled_payment_types -%}
{{ type | payment_type_svg_tag: class: 'custom-class' }}
{% endfor %}
data:
{"shop":{"enabled_payment_types":["american_express","apple_pay","diners_club","discover","google_pay","master","paypal","shopify_pay","visa"]}}
output:
<svg class="custom-class" xmlns="http://www.w3.org/2000/svg" role="img" aria-labelledby="pi-american_express" viewBox="0 0 38 24" width="38" height="24"><title id="pi-american_express">American Express</title><path fill="#000" d="M35 0H3C1.3 0 0 1.3 0 3v18c0 1.7 1.4 3 3 3h32c1.7 0 3-1.3 3-3V3c0-1.7-1.4-3-3-3Z" opacity=".07"/><path fill="#006FCF" d="M35 1c1.1 0 2 .9 2 2v18c0 1.1-.9 2-2 2H3c-1.1 0-2-.9-2-2V3c0-1.1.9-2 2-2h32Z"/><path fill="#FFF" d="M22.012 19.936v-8.421L37 11.528v2.326l-1.732 1.852L37 17.573v2.375h-2.766l-1.47-1.622-1.46 1.628-9.292-.02Z"/><path fill="#006FCF" d="M23.013 19.012v-6.57h5.572v1.513h-3.768v1.028h3.678v1.488h-3.678v1.01h3.768v1.531h-5.572Z"/><path fill="#006FCF" d="m28.557 19.012 3.083-3.289-3.083-3.282h2.386l1.884 2.083 1.89-2.082H37v.051l-3.017 3.23L37 18.92v.093h-2.307l-1.917-2.103-1.898 2.104h-2.321Z"/><path fill="#FFF" d="M22.71 4.04h3.614l1.269 2.881V4.04h4.46l.77 2.159.771-2.159H37v8.421H19l3.71-8.421Z"/><path fill="#006FCF" d="m23.395 4.955-2.916 6.566h2l.55-1.315h2.98l.55 1.315h2.05l-2.904-6.566h-2.31Zm.25 3.777.875-2.09.873 2.09h-1.748Z"/><path fill="#006FCF" d="M28.581 11.52V4.953l2.811.01L32.84 9l1.456-4.046H37v6.565l-1.74.016v-4.51l-1.644 4.494h-1.59L30.35 7.01v4.51h-1.768Z"/></svg>
<svg class="custom-class" version="1.1" xmlns="http://www.w3.org/2000/svg" role="img" x="0" y="0" width="38" height="24" viewBox="0 0 165.521 105.965" xml:space="preserve" aria-labelledby="pi-apple_pay"><title id="pi-apple_pay">Apple Pay</title><path fill="#000" d="M150.698 0H14.823c-.566 0-1.133 0-1.698.003-.477.004-.953.009-1.43.022-1.039.028-2.087.09-3.113.274a10.51 10.51 0 0 0-2.958.975 9.932 9.932 0 0 0-4.35 4.35 10.463 10.463 0 0 0-.975 2.96C.113 9.611.052 10.658.024 11.696a70.22 70.22 0 0 0-.022 1.43C0 13.69 0 14.256 0 14.823v76.318c0 .567 0 1.132.002 1.699.003.476.009.953.022 1.43.028 1.036.09 2.084.275 3.11a10.46 10.46 0 0 0 .974 2.96 9.897 9.897 0 0 0 1.83 2.52 9.874 9.874 0 0 0 2.52 1.83c.947.483 1.917.79 2.96.977 1.025.183 2.073.245 3.112.273.477.011.953.017 1.43.02.565.004 1.132.004 1.698.004h135.875c.565 0 1.132 0 1.697-.004.476-.002.952-.009 1.431-.02 1.037-.028 2.085-.09 3.113-.273a10.478 10.478 0 0 0 2.958-.977 9.955 9.955 0 0 0 4.35-4.35c.483-.947.789-1.917.974-2.96.186-1.026.246-2.074.274-3.11.013-.477.02-.954.022-1.43.004-.567.004-1.132.004-1.699V14.824c0-.567 0-1.133-.004-1.699a63.067 63.067 0 0 0-.022-1.429c-.028-1.038-.088-2.085-.274-3.112a10.4 10.4 0 0 0-.974-2.96 9.94 9.94 0 0 0-4.35-4.35A10.52 10.52 0 0 0 156.939.3c-1.028-.185-2.076-.246-3.113-.274a71.417 71.417 0 0 0-1.431-.022C151.83 0 151.263 0 150.698 0z" /><path fill="#FFF" d="M150.698 3.532l1.672.003c.452.003.905.008 1.36.02.793.022 1.719.065 2.583.22.75.135 1.38.34 1.984.648a6.392 6.392 0 0 1 2.804 2.807c.306.6.51 1.226.645 1.983.154.854.197 1.783.218 2.58.013.45.019.9.02 1.36.005.557.005 1.113.005 1.671v76.318c0 .558 0 1.114-.004 1.682-.002.45-.008.9-.02 1.35-.022.796-.065 1.725-.221 2.589a6.855 6.855 0 0 1-.645 1.975 6.397 6.397 0 0 1-2.808 2.807c-.6.306-1.228.511-1.971.645-.881.157-1.847.2-2.574.22-.457.01-.912.017-1.379.019-.555.004-1.113.004-1.669.004H14.801c-.55 0-1.1 0-1.66-.004a74.993 74.993 0 0 1-1.35-.018c-.744-.02-1.71-.064-2.584-.22a6.938 6.938 0 0 1-1.986-.65 6.337 6.337 0 0 1-1.622-1.18 6.355 6.355 0 0 1-1.178-1.623 6.935 6.935 0 0 1-.646-1.985c-.156-.863-.2-1.788-.22-2.578a66.088 66.088 0 0 1-.02-1.355l-.003-1.327V14.474l.002-1.325a66.7 66.7 0 0 1 .02-1.357c.022-.792.065-1.717.222-2.587a6.924 6.924 0 0 1 .646-1.981c.304-.598.7-1.144 1.18-1.623a6.386 6.386 0 0 1 1.624-1.18 6.96 6.96 0 0 1 1.98-.646c.865-.155 1.792-.198 2.586-.22.452-.012.905-.017 1.354-.02l1.677-.003h135.875" /><g><g><path fill="#000" d="M43.508 35.77c1.404-1.755 2.356-4.112 2.105-6.52-2.054.102-4.56 1.355-6.012 3.112-1.303 1.504-2.456 3.959-2.156 6.266 2.306.2 4.61-1.152 6.063-2.858" /><path fill="#000" d="M45.587 39.079c-3.35-.2-6.196 1.9-7.795 1.9-1.6 0-4.049-1.8-6.698-1.751-3.447.05-6.645 2-8.395 5.1-3.598 6.2-.95 15.4 2.55 20.45 1.699 2.5 3.747 5.25 6.445 5.151 2.55-.1 3.549-1.65 6.647-1.65 3.097 0 3.997 1.65 6.696 1.6 2.798-.05 4.548-2.5 6.247-5 1.95-2.85 2.747-5.6 2.797-5.75-.05-.05-5.396-2.101-5.446-8.251-.05-5.15 4.198-7.6 4.398-7.751-2.399-3.548-6.147-3.948-7.447-4.048" /></g><g><path fill="#000" d="M78.973 32.11c7.278 0 12.347 5.017 12.347 12.321 0 7.33-5.173 12.373-12.529 12.373h-8.058V69.62h-5.822V32.11h14.062zm-8.24 19.807h6.68c5.07 0 7.954-2.729 7.954-7.46 0-4.73-2.885-7.434-7.928-7.434h-6.706v14.894z" /><path fill="#000" d="M92.764 61.847c0-4.809 3.665-7.564 10.423-7.98l7.252-.442v-2.08c0-3.04-2.001-4.704-5.562-4.704-2.938 0-5.07 1.507-5.51 3.82h-5.252c.157-4.86 4.731-8.395 10.918-8.395 6.654 0 10.995 3.483 10.995 8.89v18.663h-5.38v-4.497h-.13c-1.534 2.937-4.914 4.782-8.579 4.782-5.406 0-9.175-3.222-9.175-8.057zm17.675-2.417v-2.106l-6.472.416c-3.64.234-5.536 1.585-5.536 3.95 0 2.288 1.975 3.77 5.068 3.77 3.95 0 6.94-2.522 6.94-6.03z" /><path fill="#000" d="M120.975 79.652v-4.496c.364.051 1.247.103 1.715.103 2.573 0 4.029-1.09 4.913-3.899l.52-1.663-9.852-27.293h6.082l6.863 22.146h.13l6.862-22.146h5.927l-10.216 28.67c-2.34 6.577-5.017 8.735-10.683 8.735-.442 0-1.872-.052-2.261-.157z" /></g></g></svg>
<svg class="custom-class" viewBox="0 0 38 24" xmlns="http://www.w3.org/2000/svg" role="img" width="38" height="24" aria-labelledby="pi-diners_club"><title id="pi-diners_club">Diners Club</title><path opacity=".07" d="M35 0H3C1.3 0 0 1.3 0 3v18c0 1.7 1.4 3 3 3h32c1.7 0 3-1.3 3-3V3c0-1.7-1.4-3-3-3z"/><path fill="#fff" d="M35 1c1.1 0 2 .9 2 2v18c0 1.1-.9 2-2 2H3c-1.1 0-2-.9-2-2V3c0-1.1.9-2 2-2h32"/><path d="M12 12v3.7c0 .3-.2.3-.5.2-1.9-.8-3-3.3-2.3-5.4.4-1.1 1.2-2 2.3-2.4.4-.2.5-.1.5.2V12zm2 0V8.3c0-.3 0-.3.3-.2 2.1.8 3.2 3.3 2.4 5.4-.4 1.1-1.2 2-2.3 2.4-.4.2-.4.1-.4-.2V12zm7.2-7H13c3.8 0 6.8 3.1 6.8 7s-3 7-6.8 7h8.2c3.8 0 6.8-3.1 6.8-7s-3-7-6.8-7z" fill="#3086C8"/></svg>
<svg class="custom-class" viewBox="0 0 38 24" width="38" height="24" role="img" aria-labelledby="pi-discover" fill="none" xmlns="http://www.w3.org/2000/svg"><title id="pi-discover">Discover</title><path fill="#000" opacity=".07" d="M35 0H3C1.3 0 0 1.3 0 3v18c0 1.7 1.4 3 3 3h32c1.7 0 3-1.3 3-3V3c0-1.7-1.4-3-3-3z"/><path d="M35 1c1.1 0 2 .9 2 2v18c0 1.1-.9 2-2 2H3c-1.1 0-2-.9-2-2V3c0-1.1.9-2 2-2h32z" fill="#fff"/><path d="M3.57 7.16H2v5.5h1.57c.83 0 1.43-.2 1.96-.63.63-.52 1-1.3 1-2.11-.01-1.63-1.22-2.76-2.96-2.76zm1.26 4.14c-.34.3-.77.44-1.47.44h-.29V8.1h.29c.69 0 1.11.12 1.47.44.37.33.59.84.59 1.37 0 .53-.22 1.06-.59 1.39zm2.19-4.14h1.07v5.5H7.02v-5.5zm3.69 2.11c-.64-.24-.83-.4-.83-.69 0-.35.34-.61.8-.61.32 0 .59.13.86.45l.56-.73c-.46-.4-1.01-.61-1.62-.61-.97 0-1.72.68-1.72 1.58 0 .76.35 1.15 1.35 1.51.42.15.63.25.74.31.21.14.32.34.32.57 0 .45-.35.78-.83.78-.51 0-.92-.26-1.17-.73l-.69.67c.49.73 1.09 1.05 1.9 1.05 1.11 0 1.9-.74 1.9-1.81.02-.89-.35-1.29-1.57-1.74zm1.92.65c0 1.62 1.27 2.87 2.9 2.87.46 0 .86-.09 1.34-.32v-1.26c-.43.43-.81.6-1.29.6-1.08 0-1.85-.78-1.85-1.9 0-1.06.79-1.89 1.8-1.89.51 0 .9.18 1.34.62V7.38c-.47-.24-.86-.34-1.32-.34-1.61 0-2.92 1.28-2.92 2.88zm12.76.94l-1.47-3.7h-1.17l2.33 5.64h.58l2.37-5.64h-1.16l-1.48 3.7zm3.13 1.8h3.04v-.93h-1.97v-1.48h1.9v-.93h-1.9V8.1h1.97v-.94h-3.04v5.5zm7.29-3.87c0-1.03-.71-1.62-1.95-1.62h-1.59v5.5h1.07v-2.21h.14l1.48 2.21h1.32l-1.73-2.32c.81-.17 1.26-.72 1.26-1.56zm-2.16.91h-.31V8.03h.33c.67 0 1.03.28 1.03.82 0 .55-.36.85-1.05.85z" fill="#231F20"/><path d="M20.16 12.86a2.931 2.931 0 100-5.862 2.931 2.931 0 000 5.862z" fill="url(#pi-paint0_linear)"/><path opacity=".65" d="M20.16 12.86a2.931 2.931 0 100-5.862 2.931 2.931 0 000 5.862z" fill="url(#pi-paint1_linear)"/><path d="M36.57 7.506c0-.1-.07-.15-.18-.15h-.16v.48h.12v-.19l.14.19h.14l-.16-.2c.06-.01.1-.06.1-.13zm-.2.07h-.02v-.13h.02c.06 0 .09.02.09.06 0 .05-.03.07-.09.07z" fill="#231F20"/><path d="M36.41 7.176c-.23 0-.42.19-.42.42 0 .23.19.42.42.42.23 0 .42-.19.42-.42 0-.23-.19-.42-.42-.42zm0 .77c-.18 0-.34-.15-.34-.35 0-.19.15-.35.34-.35.18 0 .33.16.33.35 0 .19-.15.35-.33.35z" fill="#231F20"/><path d="M37 12.984S27.09 19.873 8.976 23h26.023a2 2 0 002-1.984l.024-3.02L37 12.985z" fill="#F48120"/><defs><linearGradient id="pi-paint0_linear" x1="21.657" y1="12.275" x2="19.632" y2="9.104" gradientUnits="userSpaceOnUse"><stop stop-color="#F89F20"/><stop offset=".25" stop-color="#F79A20"/><stop offset=".533" stop-color="#F68D20"/><stop offset=".62" stop-color="#F58720"/><stop offset=".723" stop-color="#F48120"/><stop offset="1" stop-color="#F37521"/></linearGradient><linearGradient id="pi-paint1_linear" x1="21.338" y1="12.232" x2="18.378" y2="6.446" gradientUnits="userSpaceOnUse"><stop stop-color="#F58720"/><stop offset=".359" stop-color="#E16F27"/><stop offset=".703" stop-color="#D4602C"/><stop offset=".982" stop-color="#D05B2E"/></linearGradient></defs></svg>
<svg class="custom-class" xmlns="http://www.w3.org/2000/svg" role="img" viewBox="0 0 38 24" width="38" height="24" aria-labelledby="pi-google_pay"><title id="pi-google_pay">Google Pay</title><path d="M35 0H3C1.3 0 0 1.3 0 3v18c0 1.7 1.4 3 3 3h32c1.7 0 3-1.3 3-3V3c0-1.7-1.4-3-3-3z" fill="#000" opacity=".07"/><path d="M35 1c1.1 0 2 .9 2 2v18c0 1.1-.9 2-2 2H3c-1.1 0-2-.9-2-2V3c0-1.1.9-2 2-2h32" fill="#FFF"/><path d="M18.093 11.976v3.2h-1.018v-7.9h2.691a2.447 2.447 0 0 1 1.747.692 2.28 2.28 0 0 1 .11 3.224l-.11.116c-.47.447-1.098.69-1.747.674l-1.673-.006zm0-3.732v2.788h1.698c.377.012.741-.135 1.005-.404a1.391 1.391 0 0 0-1.005-2.354l-1.698-.03zm6.484 1.348c.65-.03 1.286.188 1.778.613.445.43.682 1.03.65 1.649v3.334h-.969v-.766h-.049a1.93 1.93 0 0 1-1.673.931 2.17 2.17 0 0 1-1.496-.533 1.667 1.667 0 0 1-.613-1.324 1.606 1.606 0 0 1 .613-1.336 2.746 2.746 0 0 1 1.698-.515c.517-.02 1.03.093 1.49.331v-.208a1.134 1.134 0 0 0-.417-.901 1.416 1.416 0 0 0-.98-.368 1.545 1.545 0 0 0-1.319.717l-.895-.564a2.488 2.488 0 0 1 2.182-1.06zM23.29 13.52a.79.79 0 0 0 .337.662c.223.176.5.269.785.263.429-.001.84-.17 1.146-.472.305-.286.478-.685.478-1.103a2.047 2.047 0 0 0-1.324-.374 1.716 1.716 0 0 0-1.03.294.883.883 0 0 0-.392.73zm9.286-3.75l-3.39 7.79h-1.048l1.281-2.728-2.224-5.062h1.103l1.612 3.885 1.569-3.885h1.097z" fill="#5F6368"/><path d="M13.986 11.284c0-.308-.024-.616-.073-.92h-4.29v1.747h2.451a2.096 2.096 0 0 1-.9 1.373v1.134h1.464a4.433 4.433 0 0 0 1.348-3.334z" fill="#4285F4"/><path d="M9.629 15.721a4.352 4.352 0 0 0 3.01-1.097l-1.466-1.14a2.752 2.752 0 0 1-4.094-1.44H5.577v1.17a4.53 4.53 0 0 0 4.052 2.507z" fill="#34A853"/><path d="M7.079 12.05a2.709 2.709 0 0 1 0-1.735v-1.17H5.577a4.505 4.505 0 0 0 0 4.075l1.502-1.17z" fill="#FBBC04"/><path d="M9.629 8.44a2.452 2.452 0 0 1 1.74.68l1.3-1.293a4.37 4.37 0 0 0-3.065-1.183 4.53 4.53 0 0 0-4.027 2.5l1.502 1.171a2.715 2.715 0 0 1 2.55-1.875z" fill="#EA4335"/></svg>
<svg class="custom-class" viewBox="0 0 38 24" xmlns="http://www.w3.org/2000/svg" role="img" width="38" height="24" aria-labelledby="pi-master"><title id="pi-master">Mastercard</title><path opacity=".07" d="M35 0H3C1.3 0 0 1.3 0 3v18c0 1.7 1.4 3 3 3h32c1.7 0 3-1.3 3-3V3c0-1.7-1.4-3-3-3z"/><path fill="#fff" d="M35 1c1.1 0 2 .9 2 2v18c0 1.1-.9 2-2 2H3c-1.1 0-2-.9-2-2V3c0-1.1.9-2 2-2h32"/><circle fill="#EB001B" cx="15" cy="12" r="7"/><circle fill="#F79E1B" cx="23" cy="12" r="7"/><path fill="#FF5F00" d="M22 12c0-2.4-1.2-4.5-3-5.7-1.8 1.3-3 3.4-3 5.7s1.2 4.5 3 5.7c1.8-1.2 3-3.3 3-5.7z"/></svg>
<svg class="custom-class" viewBox="0 0 38 24" xmlns="http://www.w3.org/2000/svg" width="38" height="24" role="img" aria-labelledby="pi-paypal"><title id="pi-paypal">PayPal</title><path opacity=".07" d="M35 0H3C1.3 0 0 1.3 0 3v18c0 1.7 1.4 3 3 3h32c1.7 0 3-1.3 3-3V3c0-1.7-1.4-3-3-3z"/><path fill="#fff" d="M35 1c1.1 0 2 .9 2 2v18c0 1.1-.9 2-2 2H3c-1.1 0-2-.9-2-2V3c0-1.1.9-2 2-2h32"/><path fill="#003087" d="M23.9 8.3c.2-1 0-1.7-.6-2.3-.6-.7-1.7-1-3.1-1h-4.1c-.3 0-.5.2-.6.5L14 15.6c0 .2.1.4.3.4H17l.4-3.4 1.8-2.2 4.7-2.1z"/><path fill="#3086C8" d="M23.9 8.3l-.2.2c-.5 2.8-2.2 3.8-4.6 3.8H18c-.3 0-.5.2-.6.5l-.6 3.9-.2 1c0 .2.1.4.3.4H19c.3 0 .5-.2.5-.4v-.1l.4-2.4v-.1c0-.2.3-.4.5-.4h.3c2.1 0 3.7-.8 4.1-3.2.2-1 .1-1.8-.4-2.4-.1-.5-.3-.7-.5-.8z"/><path fill="#012169" d="M23.3 8.1c-.1-.1-.2-.1-.3-.1-.1 0-.2 0-.3-.1-.3-.1-.7-.1-1.1-.1h-3c-.1 0-.2 0-.2.1-.2.1-.3.2-.3.4l-.7 4.4v.1c0-.3.3-.5.6-.5h1.3c2.5 0 4.1-1 4.6-3.8v-.2c-.1-.1-.3-.2-.5-.2h-.1z"/></svg>
<svg class="custom-class" xmlns="http://www.w3.org/2000/svg" role="img" viewBox="0 0 38 24" width="38" height="24" aria-labelledby="pi-shopify_pay"><title id="pi-shopify_pay">Shop Pay</title><path opacity=".07" d="M35 0H3C1.3 0 0 1.3 0 3v18c0 1.7 1.4 3 3 3h32c1.7 0 3-1.3 3-3V3c0-1.7-1.4-3-3-3z" fill="#000"/><path d="M35.889 0C37.05 0 38 .982 38 2.182v19.636c0 1.2-.95 2.182-2.111 2.182H2.11C.95 24 0 23.018 0 21.818V2.182C0 .982.95 0 2.111 0H35.89z" fill="#5A31F4"/><path d="M9.35 11.368c-1.017-.223-1.47-.31-1.47-.705 0-.372.306-.558.92-.558.54 0 .934.238 1.225.704a.079.079 0 00.104.03l1.146-.584a.082.082 0 00.032-.114c-.475-.831-1.353-1.286-2.51-1.286-1.52 0-2.464.755-2.464 1.956 0 1.275 1.15 1.597 2.17 1.82 1.02.222 1.474.31 1.474.705 0 .396-.332.582-.993.582-.612 0-1.065-.282-1.34-.83a.08.08 0 00-.107-.035l-1.143.57a.083.083 0 00-.036.111c.454.92 1.384 1.437 2.627 1.437 1.583 0 2.539-.742 2.539-1.98s-1.155-1.598-2.173-1.82v-.003zM15.49 8.855c-.65 0-1.224.232-1.636.646a.04.04 0 01-.069-.03v-2.64a.08.08 0 00-.08-.081H12.27a.08.08 0 00-.08.082v8.194a.08.08 0 00.08.082h1.433a.08.08 0 00.081-.082v-3.594c0-.695.528-1.227 1.239-1.227.71 0 1.226.521 1.226 1.227v3.594a.08.08 0 00.081.082h1.433a.08.08 0 00.081-.082v-3.594c0-1.51-.981-2.577-2.355-2.577zM20.753 8.62c-.778 0-1.507.24-2.03.588a.082.082 0 00-.027.109l.632 1.088a.08.08 0 00.11.03 2.5 2.5 0 011.318-.366c1.25 0 2.17.891 2.17 2.068 0 1.003-.736 1.745-1.669 1.745-.76 0-1.288-.446-1.288-1.077 0-.361.152-.657.548-.866a.08.08 0 00.032-.113l-.596-1.018a.08.08 0 00-.098-.035c-.799.299-1.359 1.018-1.359 1.984 0 1.46 1.152 2.55 2.76 2.55 1.877 0 3.227-1.313 3.227-3.195 0-2.018-1.57-3.492-3.73-3.492zM28.675 8.843c-.724 0-1.373.27-1.845.746-.026.027-.069.007-.069-.029v-.572a.08.08 0 00-.08-.082h-1.397a.08.08 0 00-.08.082v8.182a.08.08 0 00.08.081h1.433a.08.08 0 00.081-.081v-2.683c0-.036.043-.054.069-.03a2.6 2.6 0 001.808.7c1.682 0 2.993-1.373 2.993-3.157s-1.313-3.157-2.993-3.157zm-.271 4.929c-.956 0-1.681-.768-1.681-1.783s.723-1.783 1.681-1.783c.958 0 1.68.755 1.68 1.783 0 1.027-.713 1.783-1.681 1.783h.001z" fill="#fff"/></svg>
<svg class="custom-class" viewBox="0 0 38 24" xmlns="http://www.w3.org/2000/svg" role="img" width="38" height="24" aria-labelledby="pi-visa"><title id="pi-visa">Visa</title><path opacity=".07" d="M35 0H3C1.3 0 0 1.3 0 3v18c0 1.7 1.4 3 3 3h32c1.7 0 3-1.3 3-3V3c0-1.7-1.4-3-3-3z"/><path fill="#fff" d="M35 1c1.1 0 2 .9 2 2v18c0 1.1-.9 2-2 2H3c-1.1 0-2-.9-2-2V3c0-1.1.9-2 2-2h32"/><path d="M28.3 10.1H28c-.4 1-.7 1.5-1 3h1.9c-.3-1.5-.3-2.2-.6-3zm2.9 5.9h-1.7c-.1 0-.1 0-.2-.1l-.2-.9-.1-.2h-2.4c-.1 0-.2 0-.2.2l-.3.9c0 .1-.1.1-.1.1h-2.1l.2-.5L27 8.7c0-.5.3-.7.8-.7h1.5c.1 0 .2 0 .2.2l1.4 6.5c.1.4.2.7.2 1.1.1.1.1.1.1.2zm-13.4-.3l.4-1.8c.1 0 .2.1.2.1.7.3 1.4.5 2.1.4.2 0 .5-.1.7-.2.5-.2.5-.7.1-1.1-.2-.2-.5-.3-.8-.5-.4-.2-.8-.4-1.1-.7-1.2-1-.8-2.4-.1-3.1.6-.4.9-.8 1.7-.8 1.2 0 2.5 0 3.1.2h.1c-.1.6-.2 1.1-.4 1.7-.5-.2-1-.4-1.5-.4-.3 0-.6 0-.9.1-.2 0-.3.1-.4.2-.2.2-.2.5 0 .7l.5.4c.4.2.8.4 1.1.6.5.3 1 .8 1.1 1.4.2.9-.1 1.7-.9 2.3-.5.4-.7.6-1.4.6-1.4 0-2.5.1-3.4-.2-.1.2-.1.2-.2.1zm-3.5.3c.1-.7.1-.7.2-1 .5-2.2 1-4.5 1.4-6.7.1-.2.1-.3.3-.3H18c-.2 1.2-.4 2.1-.7 3.2-.3 1.5-.6 3-1 4.5 0 .2-.1.2-.3.2M5 8.2c0-.1.2-.2.3-.2h3.4c.5 0 .9.3 1 .8l.9 4.4c0 .1 0 .1.1.2 0-.1.1-.1.1-.1l2.1-5.1c-.1-.1 0-.2.1-.2h2.1c0 .1 0 .1-.1.2l-3.1 7.3c-.1.2-.1.3-.2.4-.1.1-.3 0-.5 0H9.7c-.1 0-.2 0-.2-.2L7.9 9.5c-.2-.2-.5-.5-.9-.6-.6-.3-1.7-.5-1.9-.5L5 8.2z" fill="#142688"/></svg>
String filters modify [strings](/docs/api/liquid/basics#string).
Deprecated: false
string | append: string
Adds a given string to the end of a string.
code:
{%- assign path = product.url -%}
{{ request.origin | append: path }}
data:
{"product":{"url":"/products/health-potion"},"request":{"origin":"https://polinas-potent-potions.myshopify.com"}}
output:
https://polinas-potent-potions.myshopify.com/products/health-potion
Deprecated: false
string | base64_decode
Decodes a string in [Base64 format](https://developer.mozilla.org/en-US/docs/Glossary/Base64).
code:
{{ 'b25lIHR3byB0aHJlZQ==' | base64_decode }}
data:
{}
output:
one two three
Deprecated: false
string | base64_encode
Encodes a string to [Base64 format](https://developer.mozilla.org/en-US/docs/Glossary/Base64).
code:
{{ 'one two three' | base64_encode }}
data:
{}
output:
b25lIHR3byB0aHJlZQ==
Deprecated: false
string | base64_url_safe_decode
Decodes a string in URL-safe [Base64 format](https://developer.mozilla.org/en-US/docs/Glossary/Base64).
code:
{{ 'b25lIHR3byB0aHJlZQ==' | base64_url_safe_decode }}
data:
{}
output:
one two three
Deprecated: false
string | base64_url_safe_encode
Encodes a string to URL-safe [Base64 format](https://developer.mozilla.org/en-US/docs/Glossary/Base64).
code:
{{ 'one two three' | base64_url_safe_encode }}
data:
{}
output:
b25lIHR3byB0aHJlZQ==
Deprecated: false
string | camelize
Converts a string to CamelCase.
code:
{{ 'variable-name' | camelize }}
data:
{}
output:
VariableName
Deprecated: false
string | capitalize
Capitalizes the first word in a string and downcases the remaining characters.
code:
{{ 'this sentence should start with a capitalized word.' | capitalize }}
data:
{}
output:
This sentence should start with a capitalized word.
Deprecated: false
string | downcase
Converts a string to all lowercase characters.
code:
{{ product.title | downcase }}
data:
{"product":{"title":"Health potion"}}
output:
health potion
Deprecated: false
string | escape
Escapes special characters in HTML, such as `<>`, `'`, and `&`, and converts characters into escape sequences. The filter doesn't effect characters within the string that don’t have a corresponding escape sequence.".
code:
{{ '<p>Text to be escaped.</p>' | escape }}
data:
{}
output:
&lt;p&gt;Text to be escaped.&lt;/p&gt;
Deprecated: false
string | escape_once
Escapes a string without changing characters that have already been escaped.
code:
# applying the escape filter to already escaped text escapes characters in HTML entities:
{{ "&lt;p&gt;Text to be escaped.&lt;/p&gt;" | escape }}
# applying the escape_once filter to already escaped text skips characters in HTML entities:
{{ "&lt;p&gt;Text to be escaped.&lt;/p&gt;" | escape_once }}
# use escape_once to escape strings where a combination of HTML entities and non-escaped characters might be present:
{{ "&lt;p&gt;Text to be escaped.&lt;/p&gt; & some additional text" | escape_once }}
data:
{}
output:
# applying the escape filter to already escaped text escapes characters in HTML entities:
&lt;p&gt;Text to be escaped.&lt;/p&gt;
# applying the escape_once filter to already escaped text skips characters in HTML entities:
&lt;p&gt;Text to be escaped.&lt;/p&gt;
# use escape_once to escape strings where a combination of HTML entities and non-escaped characters might be present:
&lt;p&gt;Text to be escaped.&lt;/p&gt; &amp; some additional text
Deprecated: false
string | handleize
Converts a string into a [handle](/docs/api/liquid/basics#handles).
code:
{{ product.title | handleize }}
{{ product.title | handle }}
data:
{"product":{"title":"Health potion"}}
output:
health-potion
health-potion
Deprecated: false
string | hmac_sha1: string
Converts a string into an SHA-1 hash using a hash message authentication code (HMAC).
code:
{%- assign secret_potion = 'Polyjuice' | hmac_sha1: 'Polina' -%}
My secret potion: {{ secret_potion }}
data:
{}
output:
My secret potion: 63304203b005ea4bc80546f1c6fdfe252d2062b2
Deprecated: false
string | hmac_sha256: string
Converts a string into an SHA-256 hash using a hash message authentication code (HMAC).
code:
{%- assign secret_potion = 'Polyjuice' | hmac_sha256: 'Polina' -%}
My secret potion: {{ secret_potion }}
data:
{}
output:
My secret potion: 8e0d5d65cff1242a4af66c8f4a32854fd5fb80edcc8aabe9b302b29c7c71dc20
Deprecated: false
string | lstrip
Strips all whitespace from the left of a string.
code:
{%- assign text = ' Some potions create whitespace. ' -%}
"{{ text }}"
"{{ text | lstrip }}"
data:
{}
output:
" Some potions create whitespace. "
"Some potions create whitespace. "
Deprecated: false
string | md5
Converts a string into an MD5 hash.
code:
{{ '' | md5 }}
data:
{}
output:
d41d8cd98f00b204e9800998ecf8427e
Deprecated: false
string | newline_to_br
Converts newlines (`\n`) in a string to HTML line breaks (`<br>`).
code:
{{ product.description | newline_to_br }}
data:
{"product":{"description":"<h3>Are you low on health? Well we've got the potion just for you!</h3>\n<p>Just need a top up? Almost dead? In between? No need to worry because we have a range of sizes and strengths!</p>"}}
output:
<h3>Are you low on health? Well we've got the potion just for you!</h3><br />
<p>Just need a top up? Almost dead? In between? No need to worry because we have a range of sizes and strengths!</p>
Deprecated: false
number | pluralize: string, string
Outputs the singular or plural version of a string based on a given number.
code:
Cart item count: {{ cart.item_count }} {{ cart.item_count | pluralize: 'item', 'items' }}
data:
{"cart":{"item_count":2}}
output:
Cart item count: 2 items
Deprecated: false
string | prepend: string
Adds a given string to the beginning of a string.
code:
{%- assign origin = request.origin -%}
{{ product.url | prepend: origin }}
data:
{"product":{"url":"/products/health-potion"},"request":{"origin":"https://polinas-potent-potions.myshopify.com"}}
output:
https://polinas-potent-potions.myshopify.com/products/health-potion
Deprecated: false
string | remove: string
Removes any instance of a substring inside a string.
code:
{{ "I can't do it!" | remove: "'t" }}
data:
{}
output:
I can do it!
Deprecated: false
string | remove_first: string
Removes the first instance of a substring inside a string.
code:
{{ "I hate it when I accidentally spill my duplication potion accidentally!" | remove_first: ' accidentally' }}
data:
{}
output:
I hate it when I spill my duplication potion accidentally!
Deprecated: false
string | remove_last: string
Removes the last instance of a substring inside a string.
code:
{{ "I hate it when I accidentally spill my duplication potion accidentally!" | remove_last: ' accidentally' }}
data:
{}
output:
I hate it when I accidentally spill my duplication potion!
Deprecated: false
string | replace: string, string
Replaces any instance of a substring inside a string with a given string.
code:
{{ product.handle | replace: '-', ' ' }}
data:
{"product":{"handle":"komodo-dragon-scale"}}
output:
komodo dragon scale
Deprecated: false
string | replace_first: string, string
Replaces the first instance of a substring inside a string with a given string.
code:
{{ product.handle | replace_first: '-', ' ' }}
data:
{"product":{"handle":"komodo-dragon-scale"}}
output:
komodo dragon-scale
Deprecated: false
string | replace_last: string, string
Replaces the last instance of a substring inside a string with a given string.
code:
{{ product.handle | replace_last: '-', ' ' }}
data:
{"product":{"handle":"komodo-dragon-scale"}}
output:
komodo-dragon scale
Deprecated: false
string | rstrip
Strips all whitespace from the right of a string.
code:
{%- assign text = ' Some potions create whitespace. ' -%}
"{{ text }}"
"{{ text | rstrip }}"
data:
{}
output:
" Some potions create whitespace. "
" Some potions create whitespace."
Deprecated: false
string | sha1: string
Converts a string into an SHA-1 hash.
code:
{%- assign secret_potion = 'Polyjuice' | sha1 -%}
My secret potion: {{ secret_potion }}
data:
{}
output:
My secret potion: bd0ca3935467e5238d7662ada4df899f09b70d5a
Deprecated: false
string | sha256: string
Converts a string into an SHA-256 hash.
code:
{%- assign secret_potion = 'Polyjuice' | sha256 -%}
My secret potion: {{ secret_potion }}
data:
{}
output:
My secret potion: 44ac1d7a2936e30a5de07082fd65d6fe9b1fb658a1a98bfe65bc5959beac5dd0
Deprecated: false
string | slice
Returns a substring or series of array items, starting at a given 0-based index.
code:
{{ collection.title | slice: 0 }}
{{ collection.title | slice: 0, 5 }}
{{ collection.all_tags | slice: 1, 2 | join: ', ' }}
data:
{"collection":{"all_tags":["Burning","dried","extra-potent","extracts","fresh","healing","ingredients","music","plant","Salty","supplies"],"title":"Products"}}
output:
P
Produ
dried, extra-potent
code:
{{ collection.title | slice: -3, 3 }}
data:
{"collection":{"title":"Products"}}
output:
cts
Deprecated: false
string | split: string
Splits a string into an array of substrings based on a given separator.
code:
{%- assign title_words = product.handle | split: '-' -%}
{% for word in title_words -%}
{{ word }}
{%- endfor %}
data:
{"product":{"handle":"health-potion"}}
output:
health
potion
Deprecated: false
string | strip
Strips all whitespace from the left and right of a string.
code:
{%- assign text = ' Some potions create whitespace. ' -%}
"{{ text }}"
"{{ text | strip }}"
data:
{}
output:
" Some potions create whitespace. "
"Some potions create whitespace."
Deprecated: false
string | strip_html
Strips all HTML tags from a string.
code:
<!-- With HTML -->
{{ product.description }}
<!-- HTML stripped -->
{{ product.description | strip_html }}
data:
{"product":{"description":"<h3>Are you low on health? Well we've got the potion just for you!</h3>\n<p>Just need a top up? Almost dead? In between? No need to worry because we have a range of sizes and strengths!</p>"}}
output:
<!-- With HTML -->
<h3>Are you low on health? Well we've got the potion just for you!</h3>
<p>Just need a top up? Almost dead? In between? No need to worry because we have a range of sizes and strengths!</p>
<!-- HTML stripped -->
Are you low on health? Well we've got the potion just for you!
Just need a top up? Almost dead? In between? No need to worry because we have a range of sizes and strengths!
Deprecated: false
string | strip_newlines
Strips all newline characters (line breaks) from a string.
code:
<!-- With newlines -->
{{ product.description }}
<!-- Newlines stripped -->
{{ product.description | strip_newlines }}
data:
{"product":{"description":"<h3>Are you low on health? Well we've got the potion just for you!</h3>\n<p>Just need a top up? Almost dead? In between? No need to worry because we have a range of sizes and strengths!</p>"}}
output:
<!-- With newlines -->
<h3>Are you low on health? Well we've got the potion just for you!</h3>
<p>Just need a top up? Almost dead? In between? No need to worry because we have a range of sizes and strengths!</p>
<!-- Newlines stripped -->
<h3>Are you low on health? Well we've got the potion just for you!</h3><p>Just need a top up? Almost dead? In between? No need to worry because we have a range of sizes and strengths!</p>
Deprecated: false
string | truncate: number
Truncates a string down to a given number of characters.
code:
{{ article.title | truncate: 15 }}
data:
{"article":{"title":"How to tell if you're out of invisibility potion"}}
output:
How to tell ...
code:
{{ article.title | truncate: 15, '--' }}
{{ article.title | truncate: 15, '' }}
data:
{"article":{"title":"How to tell if you're out of invisibility potion"}}
output:
How to tell i--
How to tell if
Deprecated: false
string | truncatewords: number
Truncates a string down to a given number of words.
code:
{{ article.content | strip_html | truncatewords: 15 }}
data:
{"article":{"content":"<p>We've all had this problem before: we peek into the potions vault to determine which potions we are running low on, and the invisibility potion bottle looks completely empty.</p>\n<p>...</p>\n<p> </p>"}}
output:
We've all had this problem before: we peek into the potions vault to determine which...
code:
{{ article.content | strip_html | truncatewords: 15, '--' }}
{{ article.content | strip_html | truncatewords: 15, '' }}
data:
{"article":{"content":"<p>We've all had this problem before: we peek into the potions vault to determine which potions we are running low on, and the invisibility potion bottle looks completely empty.</p>\n<p>...</p>\n<p> </p>"}}
output:
We've all had this problem before: we peek into the potions vault to determine which--
We've all had this problem before: we peek into the potions vault to determine which
Deprecated: false
string | upcase
Converts a string to all uppercase characters.
code:
{{ product.title | upcase }}
data:
{"product":{"title":"Health potion"}}
output:
HEALTH POTION
Deprecated: false
string | url_decode
Decodes any [percent-encoded](https://developer.mozilla.org/en-US/docs/Glossary/percent-encoding) characters in a string.
code:
{{ 'test%40test.com' | url_decode }}
data:
{}
output:
test@test.com
Deprecated: false
string | url_encode
Converts any URL-unsafe characters in a string to the [percent-encoded](https://developer.mozilla.org/en-US/docs/Glossary/percent-encoding) equivalent.
code:
{{ 'test@test.com' | url_encode }}
data:
{}
output:
test%40test.com
Deprecated: false
string | url_escape
Escapes any URL-unsafe characters in a string.
code:
{{ '<p>Health & Love potions</p>' | url_escape }}
data:
{}
output:
%3Cp%3EHealth%20&%20Love%20potions%3C/p%3E
Deprecated: false
string | url_param_escape
Escapes any characters in a string that are unsafe for URL parameters.
code:
{{ '<p>Health & Love potions</p>' | url_param_escape }}
data:
{}
output:
%3Cp%3EHealth%20%26%20Love%20potions%3C/p%3E
Tag filters output URLs that enable customers to view, add, and remove tags in the context of [collections](/docs/api/liquid/objects/collection), [products](/docs/api/liquid/objects/product), [blogs](/docs/api/liquid/objects/blog), [articles](/docs/api/liquid/objects/article), [customers](/docs/api/liquid/objects/customer), and [orders](/docs/api/liquid/objects/order).
Deprecated: false
string | link_to_add_tag
Generates an HTML `<a>` tag with an `href` attribute linking to the current blog or collection, filtered to show only articles or products that have a given tag, as well as any currently active tags.
code:
{% for tag in collection.all_tags %}
{%- if current_tags contains tag -%}
{{ tag }}
{%- else -%}
{{ tag | link_to_add_tag: tag }}
{%- endif -%}
{% endfor %}
data:
{"collection":{"all_tags":["extra-potent","fresh","healing","ingredients"]},"template":"collection"}
output:
<a href="/services/liquid_rendering/extra-potent" title="Narrow selection to products matching tag extra-potent">extra-potent</a>
<a href="/services/liquid_rendering/fresh" title="Narrow selection to products matching tag fresh">fresh</a>
<a href="/services/liquid_rendering/healing" title="Narrow selection to products matching tag healing">healing</a>
<a href="/services/liquid_rendering/ingredients" title="Narrow selection to products matching tag ingredients">ingredients</a>
Deprecated: false
string | link_to_remove_tag
Generates an HTML `<a>` tag with an `href` attribute linking to the current blog or collection, filtered to show only articles or products that have any currently active tags, except the provided tag.
code:
{% for tag in collection.all_tags %}
{%- if current_tags contains tag -%}
{{ tag | link_to_remove_tag: tag }}
{%- else -%}
{{ tag | link_to_add_tag: tag }}
{%- endif -%}
{% endfor %}
data:
{"collection":{"all_tags":["extra-potent","fresh","healing","ingredients"]},"template":"collection"}
output:
<a href="/services/liquid_rendering/extra-potent" title="Narrow selection to products matching tag extra-potent">extra-potent</a>
<a href="/services/liquid_rendering/fresh" title="Narrow selection to products matching tag fresh">fresh</a>
<a href="/services/liquid_rendering/healing" title="Narrow selection to products matching tag healing">healing</a>
<a href="/services/liquid_rendering/ingredients" title="Narrow selection to products matching tag ingredients">ingredients</a>
Deprecated: false
string | link_to_tag
Generates an HTML `<a>` tag with an `href` attribute linking to the current blog or collection, filtered to show only articles or products that have a given tag.
code:
{% for tag in collection.all_tags %}
{{- tag | link_to_tag: tag }}
{% endfor %}
data:
{"collection":{"all_tags":["extra-potent","fresh","healing","ingredients"]},"template":"collection"}
output:
<a href="/services/liquid_rendering/extra-potent" title="Show products matching tag extra-potent">extra-potent</a>
<a href="/services/liquid_rendering/fresh" title="Show products matching tag fresh">fresh</a>
<a href="/services/liquid_rendering/healing" title="Show products matching tag healing">healing</a>
<a href="/services/liquid_rendering/ingredients" title="Show products matching tag ingredients">ingredients</a>