Skip to main content
  • Guides & Documentation

Knowledgebase

Featured articles, how-to guides and quick tips.

Theming Grouped Views Fields - Twig

If you're using Views field grouping in Drupal 8, there's no doubt that you'll have to theme this using a template file.

Oftentimes, you'll need to provide a wrapper, for styling purposes, around the Views rows, dependent on the group.

In order to do that, though, you'll need to assign some kind of HTML markup around each group.

This is best accomplished through use of a views-view-unformatted.html.twig file.

Here's an example snippet of the Twig markup you'll need to be using, in order to theme grouped views rows with a group wrapper around them:

<div class="your-group-wrapper-class">
  {% for row in rows %}
    {%
    set row_classes = [
    default_row_class ? 'views-row',
    ]
    %}
  <div{{ row.attributes.addClass(row_classes) }}>
    {% if loop.first and title  %}
      <h3>{{ title }}</h3>
    {% endif %}
    {{ row.content }}
   </div>
  {% endfor %}
</div>

You can either use this directly in your views-view-unformatted.html.twig file, or (as I recommend) create a new template file dependant on the specific View that you need to target.