<p>Ok so in general this depends on if the custom field is on the product or the variant.   Assume the filed is called <code>masterImage</code> either way.</p>

<p>If the field is on a variant:
<code>{% set image = lineItem.purchasable.product.masterImage.first() %}</code></p>

<p>If the field is on the product:
<code>{% set image = lineItem.purchasable.masterImage.first() %}</code></p>

<p>Remember (either way) you should always check there is an image first really:</p>

<p><code>{% if lineItem.purchasable.product.masterImage|length %} ... set the image</code></p>

<p>In practise I usually have code that falls back to the product image if the variant image is not set for whatever reason:</p>

<pre><code>    {% set image = lineItem.purchasable.masterImage.first() ?? null %}
    {# Fallback on product image if there is no variant image set #}
    {% if not image|length %}
        {% set image = lineItem.purchasable.product.masterImage.first() ?? null %}
    {% endif %}
</code></pre>

<p>(Note here I am not doing the initial test on the asset because I am instead using the null coalescing operator)</p>

CC BY-SA 3.0
2016-10-14T08:29:04.153Z
Okay, so I have tried displaying the field on the variant with:
JackO
CC BY-SA 3.0
2016-10-14T08:31:33.127Z
But an error returns with `Variable "lineItem" does not exist`
JackO
CC BY-SA 3.0
2016-10-14T08:42:14.253Z
Yep you will need to loop through the line items ... Check the Commerce docs on order models...I'm in a taxi ;)
Jeremy Daalder
CC BY-SA 3.0
2016-10-14T09:04:51.463Z
I'm currently doing so with `{% for item in cart.lineItems %}`
JackO
CC BY-SA 3.0
2016-10-14T09:09:13.417Z
Change it to for lineItem in...
Jeremy Daalder
CC BY-SA 3.0
2016-10-14T09:16:45.660Z
Ding ding ding! We have a winner. Thanks for your assistance.
JackO
CC BY-SA 3.0
2016-10-14T19:30:50.300Z
Nice answer. You could also set fall back to a placeholder image as well if the site is expecting one and it doesn't exist.  Set up a global with an asset field like ``defaultProductVariantImage``. ``{{lineItem.purchasable.product.masterImage.first()|default(siteGlobals. defaultProductVariantImage.first) }}``
RitterKnight
CC BY-SA 3.0
2016-10-14T21:47:27.863Z
Yep that's a good idea too.  In my case I send all images to a macro which has a fallback so that step comes after and is more globally addressed :)
Jeremy Daalder
CC BY-SA 3.0
2016-10-14T02:44:26.900Z
2016-10-14T02:44:26.900Z
Jeremy Daalder
<p>Craft Commerce newbie question....</p>

<p>How do I display the image asset for a custom variant field?</p>

<p>I'd like to display the associated image of a product variant in the cart.</p>

<plugin-craftcommerce>
Display image asset of a variant
# Display image asset of a variant

(Asked by: username_0 on 2016-10-13)

Craft Commerce newbie question....

How do I display the image asset for a custom variant field?

I'd like to display the associated image of a product variant in the cart.

**Tags:** plugin-craftcommerce

---

## 1 answers

### Answer by username_1 on 2016-10-14. Score: 1 | Accepted answer

Ok so in general this depends on if the custom field is on the product or the variant.   Assume the filed is called masterImage either way.
If the field is on a variant:
{% set image = lineItem.purchasable.product.masterImage.first() %}
If the field is on the product:
{% set image = lineItem.purchasable.masterImage.first() %}
Remember (either way) you should always check there is an image first really:
{% if lineItem.purchasable.product.masterImage|length %} ... set the image
In practise I usually have code that falls back to the product image if the variant image is not set for whatever reason:
    {% set image = lineItem.purchasable.masterImage.first() ?? null %}
    {# Fallback on product image if there is no variant image set #}
    {% if not image|length %}
        {% set image = lineItem.purchasable.product.masterImage.first() ?? null %}
    {% endif %}

(Note here I am not doing the initial test on the asset because I am instead using the null coalescing operator)

> **Comments:**
> **username_0**: Okay, so I have tried displaying the field on the variant with:  
> **username_0**: But an error returns with `Variable "lineItem" does not exist`  
> **username_1**: Yep you will need to loop through the line items ... Check the Commerce docs on order models...I'm in a taxi ;)  
> **username_0**: I'm currently doing so with `{% for item in cart.lineItems %}`  
> **username_1**: Change it to for lineItem in...  
> **username_0**: Ding ding ding! We have a winner. Thanks for your assistance.  
> **username_2**: Nice answer. You could also set fall back to a placeholder image as well if the site is expecting one and it doesn't exist.  Set up a global with an asset field like ``defaultProductVariantImage``. ``{{lineItem.purchasable.product.masterImage.first()|default(siteGlobals. defaultProductVariantImage.first) }}``  
> **username_1**: Yep that's a good idea too.  In my case I send all images to a macro which has a fallback so that step comes after and is more globally addressed :)  

---

