How to use a div class to wrap some selected fields of a grid views view

Question

I have came through this:

• Views group different number of divs of a view by wrapping them
• Views - Add a wrapper DIV around a Group

but can't understand how to use a div class to wrap some selected fields of a grid views view. In my case, i want to wrap three fields of a view into a div class as the image shows below:

Answer 1

It's really simple by using the Field overwrites.

First, set the (author) User: Picture and (author) User: Name fields to "Exclude from display".

Then open the settings for Content: Post date field, and open "Rewrite results" fieldset.

Check "Rewrite output of this field". This will reveal another fieldset "Replacement Patterns" which should show you the tokens for all the fields above the current field. All you need to do is put a <div> wrapper in the textbox and copy the tokens you want in between the div tags.

Answer 2

you should use hook_views_pre_render(&$views) or theme_process_views_view_field()

function YOUR_THEME_preprocess_views_view_fields(&$vars) {

  if ($vars['view']->name == 'view_name') {

    foreach( $vars['view']->result as $key => $value) { 
      $add_start_div = '<div class="add_div">';
      $markup_for_field_name_1 = $value->field_name1[0]['rendered']['#markup'] ; 
      $value->field_name1[0]['rendered']['#markup'] = $add_start_div . $markup_for_field_name_1;
      $markup_for_field_name_3 = $value->field_name3[0]['rendered']['#markup'];
      $add_end_div = '</div>';
      $value->field_name3[0]['rendered']['#markup'] = $value->field_name3[0]['rendered']['#markup'] . $add_end_div;
    }
  }
}

Answer 3

Create a template for rows style output for example: views-view-fields--frontpage-promoted-news-story--block.tpl.php . Look in views->advanced->themes for options. Copy and paste the name of the specificity of template you want and create a file with that name, then run 'rescan' so Drupal finds the new template.

Then do something like:

<?php
$field_vals = [];
foreach($fields as $id => $field){
    $field_vals[$id]= $field->content;
}
?>
<!-- layout fields -->
<div class="promoted-news-story">
<!-- image, title, date, body, link -->
    <div class="promoted-news-story__image-wrap">
        <?php print $field_vals['field_standard_header_image'];?>
    </div>
    <div class="promoted-news-story__content-wrap">
        <h2><?php print $field_vals['title'];?></h2>
        <?php print $field_vals['field_news_date'];?>
        <?php print $field_vals['body'];?>
        <?php print $field_vals['view_node'];?>
    </div>
</div>

Answer 4

Group some fields into views div .. Please find this module ( Views fieldsets ): https://www.drupal.org/project/views_fieldsets