Skip to main content
  • Guides & Documentation

Knowledgebase

Featured articles, how-to guides and quick tips.

Iterating Through (Multiple Value) Fields in node.html.twig - Drupal

So, you've got a field in your content type which allows multiple values.

But, for some reason you're not able to use a custom field.html.twig template to address the styling for each multiple value.

This is often the case if you've got a very complex structure set up, and theming via the field.html.twig template is no longer possible, not even when using a custom one.

There are a number of reasons why this may be the case.

It could be the case, for instance, that you've referenced other entities within a field, and you need to render different values or attributes for the fields, directly within the node template.

It's going to get messy if you try to access multiple field values via a field.html.twig template, let's say if you were attempting to fetch a URL field value from within the field template for an image field.

Sometimes we have to compromise in order to save time, money, and deliver quickly. Developing a custom module just to manage this does not make sense. Let's not overcomplicate the codebase if Twig can handle this another way. Whether it looks messy or not.

Stick this directly into your node.html.twig template, and celebrate with a can of soda:

{% for image in node.field_image %}
    <div>
      <img src="{{ file_url(image.entity.fileuri) }}" />
    </div>
{% endfor %}

Switch out the bolded text above for your own; and you're golden.