background image
HomeRecent PostsDrupalSearchTagsRSSContactAboutAccount

Modifying a view and creating custom layouts using the theme wizard

Eric.London's picture

Here is a quick and powerful way to override the theme engine to get the Views module to display your content anyway you'd like. First, create a view that provides a page view. Choose "List View" as the view type. Make sure you add all the fields you'd like to include in this view. Add your filters and sort criteria as necessary. Save your view and make sure it's working. Go to the URL you assigned to the page view. You should see a <ul> list of the fields you chose to include.

Next, go to the theme wizard page (admin/build/views/wizard). Choose your view from the list and choose "simple list" as the theme type. Click on the Select Theme Type button. On the next page, you'll see two textareas full of code. Copy and past the top code into you template.php file. As for the bottom code, create a new file in your theme directory called "views-list-YOURVIEWNAME.tpl.php".

If you reload your page view, it should look the same. Now, you can alter those two code segments to get the view to appear the way you'd like. Changing the "views-list-YOURVIEWNAME.tpl.php" file will alter how each node is themed.

For example, you could use this technique to create a different table layout. The default table layout included in the views module will display a node's data in each <tr>, separating each field in a <td>. Locate the following code in you template.php file:

<?php
if ($items) {
  return
theme('item_list', $items);
}
?>

You could replace the "item_list theme type with something like this...

<?php
return "<table><tr>" . implode("", $items) . "</tr></table>";
?>

You'll also have to open up the "views-list-YOURVIEWNAME.tpl.php" file and enclose the entire contents in a <td></td>. In this case, you could also add some conditional code to segment the rows into 3 columns, etc.

Headers

I added this code in the template.php, and altered the code you wrote to get the headers in the output. Note, I have my
's set up in the custom tpl file.

<?php
  $header
= '<thead><tr>';
  foreach (
$view->field as $field) {
     
$header .= '<td>' . $field['label'] . '</td>';
  }
 
$header .= '</tr></thead>';

...

  return
"<table>" . $header . "<tbody>" . implode("", $items) . "</tbody></table>";
?>

Thanks again!

Thanks

This helped me out too. I was having trouble creating a custom table view.

Thanks.

I was looking for something just like this and now am looking into using it on my new project - an online African paintings gallery that requires various views of the paintings : http://AfricanPaintingsGallery.com - Very helpful!