image
An image, such as a product or collection image.
Properties
Returns
true
if the image is associated with a variant. Returnsfalse
if not.The
property is only available for images accessed through the following sources:
If you reference this property on an image from another source, then
nil
is returned.The ID of the image.
If you reference the
id
property for preview images ofor
media
objects, thennil
is returned.The media type of the image. Always returns
image
.The
property is only available for images accessed through the following sources:
If you reference this property on an image from another source, then
nil
is returned.ExampleFilter for media of a specific typeYou can use the
property with the
where
filter to filter theproduct.media
array for all media of a desired type.{% assign images = product.media | where: 'media_type', 'image' %}{% for image in images %}{{- image | image_url: width: 300 | image_tag }}{% endfor %}{% assign images = product.media | where: 'media_type', 'image' %} {% for image in images %} {{- image | image_url: width: 300 | image_tag }} {% endfor %}
{ "product": { "media": [ "products/oil-dripping-into-jar.jpg" ] } }
Output
<img src="//polinas-potent-potions.myshopify.com/cdn/shop/products/oil-dripping-into-jar.jpg?v=1650399519&width=300" alt="Viper venom" srcset="//polinas-potent-potions.myshopify.com/cdn/shop/products/oil-dripping-into-jar.jpg?v=1650399519&width=300 300w" width="300" height="200">The position of the image in the
product.images
orproduct.media
array.The
position
property is only available for images that are associated with a product. If you reference this property on an image from another source, thennil
is returned.- presentation
The presentation settings for the image.
A preview image for the image.
The
property is only available for images accessed through the following sources:
If you reference this property on an image from another source, then
nil
is returned.The ID of the product that the image is associated with.
The
property is only available for images associated with a product. If you reference this property on an image from another source, then
nil
is returned.The product variants that the image is associated with.
The
variants
property is only available for images accessed through the following sources:If you reference this property on an image from another source, then
nil
is returned.
{
"alt": "Charcoal",
"aspect_ratio": 1.50016818028927,
"attached_to_variant?": false,
"height": 2973,
"id": 29355706875969,
"position": 1,
"product_id": 6790277595201,
"src": {},
"variants": [],
"width": 4460
}
Referencing the image
object directly
image
object directlyWhen an image
object is referenced directly, the image's relative URL path is returned.
{{ product.featured_image }}
{
"product": {
"featured_image": "products/mushrooms-on-a-table.jpg"
}
}