Shopify Liquid MCP Server

# Image An image, such as a product or collection image. To learn about the image formats that Shopify supports, visit the [Shopify Help Center](https://help.shopify.com/manual/online-store/images/theme-images#image-formats). > **Tip:** Use the [`image_url`](https://shopify.dev/docs/api/liquid/filters/image_url) and [`image_tag`](https://shopify.dev/docs/api/liquid/filters/image_tag) filters to display images on the storefront. ## Properties | Property | Type | Description | |----------|------|-------------| | `alt` | string | The alt text of the image. | | `aspect_ratio` | number | The aspect ratio of the image as a decimal. | | `attached_to_variant?` | boolean | Returns `true` if the image is associated with a variant. Only available for images from `product.featured_image` or `product.images`. Returns `nil` otherwise. | | `height` | number | The height of the image in pixels. | | `id` | number | The ID of the image. Returns `nil` for preview images of `generic_file` or `media` objects. | | `media_type` | string | The media type of the image. Always returns `image`. Only available for images from `product.media` or `file_reference` metafields. Returns `nil` otherwise. | | `position` | number | The position of the image in `product.images` or `product.media` arrays. Only available for product-associated images. | | `presentation` | image_presentation | The presentation settings for the image. | | `preview_image` | image | A preview image. Only available from `product.featured_media`, `product.media`, or `file_reference` metafields. | | `product_id` | number | The ID of the associated product. Only available for product-associated images. | | `src` | string | The relative URL of the image. | | `variants` | array of variant | The product variants associated with the image. Only available from `product.featured_image` or `product.images`. | | `width` | number | The width of the image in pixels. | ## Referencing the Image Object Directly When an `image` object is referenced directly, the image's relative URL path is returned. ### Code ```liquid {{ product.featured_image }} ``` ### Data ```json { "product": { "featured_image": "products/mushrooms-on-a-table.jpg" } } ``` ### Output ```html products/mushrooms-on-a-table.jpg ``` ## Filtering Media by Type You can use the `media_type` property with the [`where` filter](https://shopify.dev/docs/api/liquid/filters/where) to filter the `product.media` array for specific media types. ### Code ```liquid {% assign images = product.media | where: 'media_type', 'image' %} {% for image in images %} {{- image | image_url: width: 300 | image_tag }} {% endfor %} ``` ### Data ```json { "product": { "media": [ "products/oil-dripping-into-jar.jpg" ] } } ``` ### Output ```html <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"> ```