How do I group my fields in a view?

Question

I have a content type (Staff Member) with many fields, such as portrait, name, and bio. The name and bio fields are grouped together under the field group _text_fields_.

I have created a view for this content type.

The view renders each content node like this.

<div class="views-row">
  <div class="staff photo"><img src="...." /></div>
  <div class="staff name">John Doe</div>
  <div class="staff bio">John Doe has been with us for 800 years.</div>
</div>

However, I want grouped fields to be grouped like this.

<div class="views-row">
  <div class="staff photo"><img src="...." /></div>
  <div class="text_fields">
    <div class="staff name">John Doe</div>
    <div class="staff bio">John Doe has been with us for 800 years.</div>
  </div>
</div>

I've tried writing a views-view--staff-members.tpl.php template file, but it receives all of the .views-row items as a HTML string.

How might I accomplish this?

Answer 1

You don't need to modify your .tpl, you only need the Field Group module to group your fields together. With this module you have the possibility to add groups to wrap their fields together. Fieldgroup comes with default HTML wrappers like vertical tabs, horizontal tabs, accordions, fieldsets or div wrappers.

You can read the documentation where you will find some examples.