Outputting multiple content fields all wrapped in a div [duplicate]

Question

I'm trying to wrap multiple field items in an HTML container.

So let's say I have "Blog" content type. I have field1, field2, field3, field4 and field5 for this content type.

I want to output field2, field3 and field4 wrapped together in a DIV.

I've been Googling and tinkering for the past 3 hours and I haven't gotten anywhere.

Any help out there?

Drupal 7, Zen subtheme.

I read this and didn't have any luck here either: Wrapping multiple cck fields into a single div tag for theming?

Answer 1

Multiple ways to achieve this.

1. By creating a node tpl file for that particular content type.
2. By creating view.
3. But i think the best and easiest way is creating group in manage display. Check field group module.

Procedure to create group.

1. Go to structure->content types->content(ex-blog)->manage displays.
2. Add a new group of div type.
3. Drag the required field like field2 , field3 etc under it.

Print in tpl file.

It will be easy to find out if you will update the code snippet of node--case-study.tpl.php file.

I think you need to first check by printing

echo '<pre>';
print_r($content);

and use this for

<div class="y">
  <?php print($content['field1']); ?>
</div>

<div class="x">
 <?php 
    print($content['field2']);
    print($content['field3']);
    print($content['field4']); 
 ?>
</div>

Answer 2

Create a empty file with name [node-ContentType.tpl.php] for your content_type node template file and place it at sites/all/themes/your_theme/templates. Flush all caches.

In this file you have the access $node variable which contains the all fields in that node. Now wite your custom html to breakdown your fields into differnt divs.

<div class="first-pane">
  <?php print $node->field1[0]['value']; ?>
</div>
<div class="second-pane">
 <?php print $node->field2[0]['view']; ?>
 <?php print $node->field3[0]['view']; ?>
 <?php print $node->field4[0]['view']; ?>
</div>
<div class="third-pane">
  <?php print $node->field5[0]['value']; ?>
</div>

For further parameters details, try this.