Description

The following snippets illustrate how you can override the default table views output from the views module using snippets you can copy and paste into your template.php file.

Please also note the following handbook page Theming table views using your style sheet (.CSS)

Method 1 of 2 - Theme ALL table views using your TEMPLATE.PHP file

The snippet below, illustrates how to override the default theme for *all* table views in your site. Paste this into the TEMPLATE.PHP file in your theme folder and change to suit.

This example adds the attributes cellspacing='4' border='1' to all table views on your site.

<?php
 /**
 * This snippet will override all table views in your site
 * Paste this into your template.php file and change the viewname in the first line
 * and the attributes in the second last line of the snippet.
 */

function phptemplate_views_view_table ($view, $nodes, $type) {
  $fields = _views_get_fields();

  foreach ($nodes as $node) {
    $row = array();
    foreach ($view->field as $field) {
      if ($fields[$field['id']]['visible'] !== FALSE) {
        $cell['data'] = views_theme_field('views_handle_field', $field['queryname'], $fields, $field, $node, $view);
        $cell['class'] = "view-field ". views_css_safe('view-field-'. $field['queryname']);
        $row[] = $cell;
      }
    }
    $rows[] = $row;
  }
  return theme('table', $view->table_header, $rows, array('cellspacing'=>'4', 'border'=>'1'));
}
?>

Method 2 of 2 - Theme a specific table view using your TEMPLATE.PHP file

The snippet below, illustrates how to theme a specific table view in your site. Paste this into the TEMPLATE.PHP file in your theme folder and change to suit.

This example adds the attributes cellspacing='4' border='1' to the viewname table view on your site.

Where viewname is the unique identifier of the view or the name you gave the view in the Basic Information options. Click on ADMINISTER -> VIEWS to see a list of your Existing Views. The unique identifier or view name is in the first column.

<?php
 /**
 * This snippet will override a specific table view in your site
 * Paste this into your template.php file and change the viewname in the first line
 * and the attributes in the second last line of the snippet.
 */

function phptemplate_views_view_table_viewname($view, $nodes, $type) {
  $fields = _views_get_fields();

  foreach ($nodes as $node) {
    $row = array();
    foreach ($view->field as $field) {
      if ($fields[$field['id']]['visible'] !== FALSE) {
        $cell['data'] = views_theme_field('views_handle_field', $field['queryname'], $fields, $field, $node, $view);
        $cell['class'] = "view-field ". views_css_safe('view-field-'. $field['queryname']);
        $row[] = $cell;
      }
    }
    $rows[] = $row;
  }
  return theme('table', $view->table_header, $rows, array('cellspacing'=>'4', 'border'=>'1'));
}
?>

Notes

  • See also the following handbook page Theming table views using your style sheet (.CSS)
  • The above snippets are only for use with the views.module.
  • More snippets will follow, including how to override the default cell/row theme layout of table views.

Comments

appel’s picture

appel commented

Is it possible to spread the data of one single row over 2 rows?

Like so:


--------------------
| date 1 | title 1 |
--------------------
| author 1 | link 1 |
--------------------
| date 2 | title 2 |
--------------------
| author 2 | link 2 |
--------------------

'What's a Texas?'

pingers’s picture

pingers commented

Yes, you need to change the way the $row is constructed... i.e. add the pieces you want to each $row. (using $row[] = )

This is the part you need to play with:

  foreach ($nodes as $node) {
    $row = array();
    foreach ($view->field as $field) {
      if ($fields[$field['id']]['visible'] !== FALSE) {
        $cell['data'] = views_theme_field('views_handle_field', $field['queryname'], $fields, $field, $node, $view);
        $cell['class'] = "view-field ". views_css_safe('view-field-'. $field['queryname']);
        $row[] = $cell;
      }
    }
rj’s picture

rj commented

I had 4 fields and I wanted the last field to appear on a second row. Here's what I did:

function zen_views_view_table_og($view, $nodes, $type) {
  $fields = _views_get_fields();

  foreach ($nodes as $node) {
    $row = array();
    // Add additional variable for second row field(s)
	$row2 = array();
    foreach ($view->field as $field) {
      if ($fields[$field['id']]['visible'] !== FALSE) {
		  // Switch depending on field name
		  switch ($field['field']) {
		  
		  case 'title';
			$cell['data'] = views_theme_field('views_handle_field', $field['queryname'], $fields, $field, $node, $view);
			$cell['class'] = "view-field ". views_css_safe('view-field-'. $field['queryname']);
			// Add colspan for each field, otherwise it doens't work right.
			$cell['colspan'] = '1';
			$row[] = $cell;
		  break;
		  
		  case 'count';
			$cell['data'] = views_theme_field('views_handle_field', $field['queryname'], $fields, $field, $node, $view);
			$cell['class'] = "view-field ". views_css_safe('view-field-'. $field['queryname']);
			$cell['colspan'] = '1';
			$row[] = $cell;
		  break;
		  
		  case 'description';
			$cell['data'] = views_theme_field('views_handle_field', $field['queryname'], $fields, $field, $node, $view);
			$cell['class'] = "view-field ". views_css_safe('view-field-'. $field['queryname']);
			$cell['colspan'] = '2';
			$row[] = $cell;
		  break;
		  
		  // Field to place on second line
		  case 'subscribe';
			$cell['data'] = views_theme_field('views_handle_field', $field['queryname'], $fields, $field, $node, $view);
			$cell['class'] = "view-field ". views_css_safe('view-field-'. $field['queryname']);
			$cell['colspan'] = '4';
			$row2[] = $cell;
		  break;
		  }
      }
    }
    //Place $row into first row
	$rows[] = $row;
	// Place $row2 into second row
	$rows[] = $row2;
  }
  // You may need to go to your view and remove the field label for the table header to display properly.
  return theme('table', $view->table_header, $rows);

}

--rj

Rowanw’s picture

Rowanw commented

The table uses 5 fields including a CCK field called 'field_hotel_rating_value', which returns a simple number from 1-5. I wrapped an image around the value so the source of the image is affected by the field's value.

<?php
function phptemplate_views_view_table_hotel_listing($view, $nodes, $type) {
  $fields = _views_get_fields();

  foreach ($nodes as $node) {
    $row = array();
    foreach ($view->field as $field) {
      //print $field['field'] .' | '; // field names
      if ($fields[$field['id']]['visible'] !== FALSE) {
        switch ($field['field']) {
          case 'field_main_image_fid';
            $cell['data'] = views_theme_field('views_handle_field', $field['queryname'], $fields, $field, $node, $view);
            $cell['class'] = "view-field ". views_css_safe('view-field-'. $field['queryname']);
            $row[] = $cell;
          break;
          case 'title';
            $cell['data'] = views_theme_field('views_handle_field', $field['queryname'], $fields, $field, $node, $view);
            $cell['class'] = "view-field ". views_css_safe('view-field-'. $field['queryname']);
            $row[] = $cell;
          break;
          case 'body';
            $cell['data'] = views_theme_field('views_handle_field', $field['queryname'], $fields, $field, $node, $view);
            $cell['class'] = "view-field ". views_css_safe('view-field-'. $field['queryname']);
            $row[] = $cell;
          break;
          case 'field_hotel_rating_value';
            $cell['data'] = '<img src="/files/images/star-'. views_theme_field('views_handle_field', $field['queryname'], $fields, $field, $node, $view) .'.gif" alt="star rating" />';
            $cell['class'] = "view-field ". views_css_safe('view-field-'. $field['queryname']);
            $row[] = $cell;
          break;
          case 'view';
            $cell['data'] = views_theme_field('views_handle_field', $field['queryname'], $fields, $field, $node, $view);
            $cell['class'] = "view-field ". views_css_safe('view-field-'. $field['queryname']);
            $row[] = $cell;
          break;
        }
      }
    }
    $rows[] = $row;
  }
  return theme('table', $view->table_header, $rows);
}
?>
whtcyphr’s picture

whtcyphr commented

First Off, Thanks For all the great information above. It Helps Greatly for a newbie to drupal/views and php like myself. However, I'm having trouble figuring out how to show a three column row with :

1.) Each row column #1 as a optional $count in admin.
(this is a minor concern really, i'm teaching myself how make a module which i think this is needed.)
2.) Each row column #2 display the field Label
3.) Each row column #3 display the field value

**** EXAMPLE #1 ****

CCK Field Group Title
================================================
Row 1 | *$count Value* | *Field 1 Label* | *Field 1 Value*
================================================
Row 2 | *$count Value* | *Field 2 Label* | *Field 2 Value*
================================================

My node page has four views attached tables with specific CCK Fields for that node that i'm trying to have displayed like this. Theming the node page isn't a problem (just wanted to give the main goal i'm after).

**** EXAMPLE #2 ****

===| Node Pg. Content |====
=======================
----- Views Attachments -----
===| Table 1 | Table 2 |=====
------------------------------
===| Table 3 | Table 4 |=====

I have the views template in my theme folder named
* views-view-table--course-table-info--attachment.tpl * and i have the current code now (doesn't show the $count column yet):

<?php foreach ($rows as $count => $row): ?>
<table class="interiortable">
  <tbody>
      <? // TODO: Display CCK Field Group Name & The $count column ?>
      <tr>
          <?php foreach ($row as $field => $content): ?>
<!-- column 1 -->
          <td class="<?php print $fields[$field]; ?>">
               <?php print $fields['label']->content; ?>   <? // Not Sure how to display the Label properly ?>
          </td>

<!-- column 2 -->
          <td class="<?php print $fields[$field]; ?>">
            <?php  print $row['content'];?>                  <? // Not Sure how to display the cck field values defined in the view ?>
           </td>
        <?php endforeach; ?>
      </tr>
  </tbody>
</table>
<?php endforeach; ?>

I'm really trying to figure this out, and i'm sure it's something pretty simple I'm missing here.

~whtcyphr

I also checked out the following to try and figure this out myself and I think i'm getting close.
Views 2 Handbook : http://drupal.org/handbook/modules/views
Views 2 Theming : http://drupal.org/node/352970
Table view - row numbering : http://drupal.org/node/165516
Theming Views 2 (.tpl.php files) : http://drupal.org/node/303902
Theming Views 2 – The Basics : http://www.group42.ca/theming_views_2_the_basics

ronald_istos’s picture

ronald_istos commented

For anyone wanting to theme Views results in Drupal 6 your best (and cleanest) option is really to modify the tpl files of views.

This link provides some more information:

Views 2 Theming : http://drupal.org/node/352970

---
@ronald_istos
http://roomify.us

resting’s picture

resting commented

Any example how to do a 4x4 table? I can't even get it to display in a row of 4 columns.

fadaco’s picture

fadaco commented

Can anybody tell me how I can join a field to multiple column, such that a particular field exxtend through 2 or more column ... www.comparethemarket.com/loans

frankblaze’s picture

frankblaze commented

I have a seriously question that has been bothering me and i hope you guys can help me out. Anytime i create a drupal 7 site and use a mobile responsive theme, every content will be converted to fit a mobile screen except any views that i created. Please how can i create a view that will automatically response to mobile view? Please i need a solution and a guideline on how to achieve this.

Thank you

garyk.hansen2018’s picture

garyk.hansen2018 commented

please to be helped because at this time I was there project making table but I want to combine with css, pakah code is right yah?

echo "

";
for ($i=0;$i for ($j=0;$j $k = $days[$i].$times[$j];
if (array_key_exists($k,$date)){
echo "

";
$j+=$date[$k][1]-1;
}else
echo "

";
}

echo "

";
}
echo "

".
"{$date[$k][0]}		 $k

";
--

https://personalfinanceallinfo.com