I know this issue has been requested before and I know there are some solutions to it which I list below but I would like to propose a cleaner solution that allows for better control in the UI and better visibility.


In my View I output a list of fields e.g.

  • User Picture
  • First Name
  • Last Name
  • Address
  • Description

And Ideally I would like the markup to be something like:

<div class="user-picture">
  <img src="pic.jpg" alt="User Pic" />
<div class="contact-wrapper">
  <div class="name">
<div class="description">

Currently I know of three ways to achieve this, none of which I particularly like -

  1. Modifying the tpl files and checking field names and adding divs there where appropriate or adding open close divs to the field templates
  2. Excluding fields from display and rewriting the output of the last field to display which includes all the wrapper divs and excluded fields
  3. Adding global text fields above and below the fields to wrap with the output rewritten to be a <div> and </div> respectively.

However, I think a trick has been missed here that would make it a lot easier to achieve this. In the "Rearrange fields" UI, the drag handles on the fields could shift right for fields you'd want to group together - just like how the Menu and Taxonomy drag handles work for different depths.

So the above fields could look something like the attached picture in the UI. This (to me at least!) shows it's obvious that the Last Name and Address should belong in the same div as the first name. And then once these fields are shifted and Apply is clicked, another modal box could ask what HTML tag to wrap the fields in and any CSS classes etc. for the wrapper.

Or similar to the above could be on the Add Fields drop down, is an Add Groups link (like the Fieldgroup module provides for Fields in nodes and other entities). Then you group the Fields under a collective title which holds the HTML information etc.

I would be willing to spend some time on this (either as a Views feature, separate module or Plugin) if there is a demand for this, but I don't know where to start as I've never worked with Views plugins or looked into the Views code. I just use the module and the API.

rearrange_fields.png25.87 KBDrupalGideon
Members fund testing for the Drupal project. Drupal Association Learn more