<p>Anyone here using the Imager plugin and creating responsive images using srcset and sizes?
Any ideas on how to avoid creating multiple versions of the same image if the original asset uploaded is smaller than the set transforms? I added the setting <code>'allowUpscale'       =&gt;      false,</code> but this has resulted in 7 versions of the same image (same dimensions etc)
<a href="https://github.com/aelvan/Imager-Craft" rel="nofollow noreferrer">https://github.com/aelvan/Imager-Craft</a></p>

<p>For example:</p>

<pre><code>/imager/resources/general/359/Golden-Retriever-Isolated_b4a9cbfcf0e16c2bbe8891faf2f17377.jpg 302w, 
/imager/resources/general/359/Golden-Retriever-Isolated_46442a24ab3b20705cf025765c954564.jpg 302w, 
/imager/resources/general/359/Golden-Retriever-Isolated_dc3d89e10897fe49613e23ec867b72c7.jpg 302w, 
/imager/resources/general/359/Golden-Retriever-Isolated_13d85085a2b68d4289e86166bdc76d2f.jpg 302w,
/imager/resources/general/359/Golden-Retriever-Isolated_033ae678b7fe3957fc7ac9eab98c2dac.jpg 302w, 
/imager/resources/general/359/Golden-Retriever-Isolated_78f5cce99e1c3c7765fb260eb99fceaa.jpg 302w, 
/imager/resources/general/359/Golden-Retriever-Isolated_3907e8c0ed1757af4be1f9f097fb579b.jpg 302w, 
/imager/resources/general/359/Golden-Retriever-Isolated_6e4e16791425f7dfc1ab06a09cd800f4.jpg 302w, 
/imager/resources/general/359/Golden-Retriever-Isolated_042ca14a1382a40b78a83ee7d3f8e3dd.jpg 300w
</code></pre>

<p>Edit: here is my code as requested.</p>

<pre><code>{% case "image" %}
{% set image = block.image.first() %}
{% set transformedImages = craft.imager.transformImage(image, [
        { width: 1680 },
        { width: 1430 },
        { width: 1350 },
        { width: 1150 },
        { width: 840 },
        { width: 715 },
        { width: 660 },
        { width: 450},
        { width: 300}
    ], { mode: 'fit' })
%}
&lt;figure{%- if block.position != "full" %} class="img-{{ block.position }}--small"{% endif -%}&gt;
    &lt;img
        src="{{ craft.imager.transformImage(image, { width: 715, mode: 'fit' }) }}"
        srcset="{{ craft.imager.srcset(transformedImages) }}"
        sizes="{{ (block.position == 'full') ? '(max-width: 60em) 100vw, 61.5vw' : '(max-width: 37.5em) 100vw, (max-width: 81.25em) 30vw, 400px'  }}"
        alt="{{ image.altText ?: image.title }}"
    /&gt;
    {% if block.caption|length %}
    &lt;figcaption class="figcaption"&gt;
        {{ block.caption }}
    &lt;/figcaption&gt;
    {% endif %}
&lt;/figure&gt;
</code></pre>

CC BY-SA 3.0
2016-11-09T20:14:00.073Z
Can you show all your code?
Nutmeg
CC BY-SA 3.0
2016-11-09T21:11:08.387Z
I'd call that a bug. Do you mind adding an issue to the repo?
André Elvan
CC BY-SA 3.0
2016-11-09T22:11:08.657Z
I have added the code into the original question.
@AndréElvan I will post on the Repo now.
Terry Upton
<image-transforms><responsive-images><plugin-imager>
Responsive images using Imager when original asset isn't large enough
# Responsive images using Imager when original asset isn't large enough

(Asked by: username_0 on 2016-11-09)

Anyone here using the Imager plugin and creating responsive images using srcset and sizes?
Any ideas on how to avoid creating multiple versions of the same image if the original asset uploaded is smaller than the set transforms? I added the setting 'allowUpscale'       =>      false, but this has resulted in 7 versions of the same image (same dimensions etc)
https://github.com/aelvan/Imager-Craft
For example:
/imager/resources/general/359/Golden-Retriever-Isolated_b4a9cbfcf0e16c2bbe8891faf2f17377.jpg 302w, 
/imager/resources/general/359/Golden-Retriever-Isolated_46442a24ab3b20705cf025765c954564.jpg 302w, 
/imager/resources/general/359/Golden-Retriever-Isolated_dc3d89e10897fe49613e23ec867b72c7.jpg 302w, 
/imager/resources/general/359/Golden-Retriever-Isolated_13d85085a2b68d4289e86166bdc76d2f.jpg 302w,
/imager/resources/general/359/Golden-Retriever-Isolated_033ae678b7fe3957fc7ac9eab98c2dac.jpg 302w, 
/imager/resources/general/359/Golden-Retriever-Isolated_78f5cce99e1c3c7765fb260eb99fceaa.jpg 302w, 
/imager/resources/general/359/Golden-Retriever-Isolated_3907e8c0ed1757af4be1f9f097fb579b.jpg 302w, 
/imager/resources/general/359/Golden-Retriever-Isolated_6e4e16791425f7dfc1ab06a09cd800f4.jpg 302w, 
/imager/resources/general/359/Golden-Retriever-Isolated_042ca14a1382a40b78a83ee7d3f8e3dd.jpg 300w

Edit: here is my code as requested.
{% case "image" %}
{% set image = block.image.first() %}
{% set transformedImages = craft.imager.transformImage(image, [
        { width: 1680 },
        { width: 1430 },
        { width: 1350 },
        { width: 1150 },
        { width: 840 },
        { width: 715 },
        { width: 660 },
        { width: 450},
        { width: 300}
    ], { mode: 'fit' })
%}

    
    {% if block.caption|length %}
    
        {{ block.caption }}
    
    {% endif %}

**Tags:** image-transforms, responsive-images, plugin-imager
> **Comments:**
> **username_1**: Can you show all your code?  
> **username_2**: I'd call that a bug. Do you mind adding an issue to the repo?  
> **username_0**: I have added the code into the original question. @AndréElvan I will post on the Repo now.  

---

## 0 answers

