<p>If I understand the question properly, this should do it for you:</p>

<pre><code>{% if entry.gallery|length %}
&lt;div class="main-carousel"&gt;
    {% for image in entry.gallery.all() %}
    &lt;div class="carousel-cell"&gt;
        &lt;img src="{{ image.url }}" alt="{{ image.title }}" /&gt;
    &lt;/div&gt;
    {% endfor %}
&lt;/div&gt;
{% endif %}
</code></pre>

CC BY-SA 4.0
2020-05-06T10:14:43.950Z
2020-05-06T10:14:43.950Z
Oli
<p>I'm trying to use <a href="https://flickity.metafizzy.co/" rel="nofollow noreferrer">flickity</a> to create a draggable gallery on a single entry template, but I'm having issues with the output.</p>

<p>In the backend it looks like this. A field using multiple assets.
<a href="https://i.sstatic.net/AmQbd.jpg" rel="nofollow noreferrer"><img src="https://i.sstatic.net/AmQbd.jpg" alt="enter image description here"></a></p>

<p>Without flickity I'd put them out like this which lists each image from the field.</p>

<pre><code>{% if entry.gallery|length %}
    {% for image in entry.gallery.all() %}
      &lt;img src="{{ image.url }}" alt="{{ image.title }}" /&gt;
    {% endfor %}
  {% endif %}
</code></pre>

<p>For flickity to work it needs to look like this </p>

<pre><code>&lt;div class="main-carousel"&gt;
  &lt;div class="carousel-cell"&gt;&lt;img src=""&gt;&lt;/div&gt;
  &lt;div class="carousel-cell"&gt;&lt;img src=""&gt;&lt;/div&gt;
  &lt;div class="carousel-cell"&gt;&lt;img src=""&gt;&lt;/div&gt;
&lt;/div&gt;
</code></pre>

<p>I have trouble combining these two things successfully. The goal is to dynamically output each image from the assets into a carousel-cell div. Does anyone have pointers how to do so? Thank you!</p>

<assets><field><forloop><assets-field>
Outputting image assets with flickity
# Outputting image assets with flickity

(Asked by: username_0 on 2020-05-06)

I'm trying to use flickity to create a draggable gallery on a single entry template, but I'm having issues with the output.
In the backend it looks like this. A field using multiple assets.

Without flickity I'd put them out like this which lists each image from the field.
{% if entry.gallery|length %}
    {% for image in entry.gallery.all() %}
      
    {% endfor %}
  {% endif %}

For flickity to work it needs to look like this 

  
  
  


I have trouble combining these two things successfully. The goal is to dynamically output each image from the assets into a carousel-cell div. Does anyone have pointers how to do so? Thank you!

**Tags:** assets, field, forloop, assets-field


---

## 1 answers

### Answer by username_1 on 2020-05-06. Score: 1

If I understand the question properly, this should do it for you:
{% if entry.gallery|length %}

    {% for image in entry.gallery.all() %}
    
        
    
    {% endfor %}

{% endif %}


---

