Theming Views

De Views module is standaard uitrusting voor de professionele Drupal themer. Hiermee kun je overzichten van nodes maken, die in vrijwel elke website voorkomen. Overzichten zoals...

• Blog posts
• Nieuws overzicht
• Vacatures
• Logo's van klanten
• Een Jcarousel van slides

Themen van Pages, Nodes, Comments en Blocks

Pagina's kun je in Drupal eenvoudig themen. Afhankelijk van de pagina, kun je deze themen met een page-eennode.tpl.php (gebruik je Pathauto om automatisch URL aliasses aan te maken voor content types, dan moet je daarvoor iets meer doen).

"In Drupal 5.0, PHPTemplate supports the use of multiple page templates for a single theme. Depending on the current url path (node/1, taxonomy/term/2, or user/1, for example), PHPTemplate will search for multiple templates before falling back on the default page.tpl.php file."

Op deze manier kun je in Drupal zeer veel themen. Bijvoorbeeld...

• Nodes: bijvoorbeeld node-portfolio.tpl.php
• Comments: comment.tpl.php en comment-form.tpl.php
• Blocks

Themen van Views

Voor Views kun je hiervoor de Views Theme Wizard gebruiken. Deze zit standaard bij de Views module, maar staat niet standaard aan. De Views Theming Wizard is te vinden als extra tab 'Theme wizard' in de Views sectie van je website. Ik maak er meestal een extra entry voor aan in het Admin menu.

Enige voorwaarde voor volledige controle over hoe je je view themed is: het moet een list view zijn. Dat is jammer, maar de vrijheid die je krijgt is de moeite waard.

Wanneer je de Theme wizard doorloopt, moet je eerst een keuze maken uit de reeds aangemaakt views en theme types (simple, grouped). Ben er niet achter wat het effect is van deze laatste optie. Iemand?. Daarna krijg je drie pakketjes met kant-en-klare code:

• Je template functie; Deze moet je plakken in je template.php welke je view template zal aanroepen
• Je view template, bijvoorbeeld: views-list-portfolio.tpl.php
• De bijbehorende CSS, te pasten in views-list-portfolio.css

Alle velden die in je View zijn gedefinieerd zijn nu themable in je view template, compleet met <div>'s. Ideaal.

Generieke code

Er zit echter ook een nadeel aan deze techniek: de code die de Views Theme Wizard genereert is niet generiek. Dus voor elke view moet je de wizard uitvoeren en de nieuwe functie (voor 95% hetzelfde) in je template.php plakken. Daarom hebben we de functie aangepast zodat deze generiek toepasbaar is voor al je views.

1. Plaats dit in je template.php...

/*
 * Generic List view Function
 * Based on Views Theme Wizard.
 * ©2008 Byelex. All rights reserved.
 * www.netwatmeer.nl || www.byelex.com
 */
function generic_view_list($view, $nodes, $type, $viewName) {
  $fields = _views_get_fields();

  $taken = array();

  // Set up the fields in nicely named chunks.
  foreach ($view->field as $id => $field) {
    $field_name = $field['field'];
    if (isset($taken[$field_name])) {
      $field_name = $field['queryname'];
    }
    $taken[$field_name] = true;
    $field_names[$id] = $field_name;
  }

  // Set up some variables that won't change.
  $base_vars = array(
    'view' => $view,
    'view_type' => $type,
  );

  foreach ($nodes as $i => $node) {
    $vars = $base_vars;
    $vars['node'] = $node;
    $vars['count'] = $i;
    $vars['stripe'] = $i % 2 ? 'even' : 'odd';
    foreach ($view->field as $id => $field) {
      $name = $field_names[$id];
      $vars[$name] = views_theme_field('views_handle_field', $field['queryname'], $fields, $field, $node, $view);
      if (isset($field['label'])) {
        $vars[$name . '_label'] = $field['label'];
      }
    }
    $items[] = _phptemplate_callback($viewName, $vars);
  }
  if ($items) {
    return theme('item_list', $items);
  }
}

2. Plaats voor elke view dit eronder en pas de naam van de phptemplate callback aan, aan de naam van je view... (dus: '_views_view_list_portfolio' en 'view-list-portfolio')

//Portolio list view callback function phptemplate_views_view_list_portfolio($view, $nodes, $type) { return generic_view_list($view, $nodes, $type,'view-list-portfolio'); }

3. Kopieerde code uit de Theme Wizard t.b.v. je view template in een nieuw bestand, bijvoorbeeld: 'views-list-portfolio.tpl.php'. Je hebt dan ook meteen alle beschikbare veld variabelen (die je zelf hebt gedefinieerd in de view) bij de hand.

Als je de structuur eenmaal doorhebt, hoeft je steeds alleen nog maar de Wizard door voor stap 3. De functie is generiek (dus maar 1x!) en de callback is een kwestie van kopiëren-plakken en aanpassen

Alle benodigde code zit in het attachment. Happy theming!