User login

Theming CCK Views the Agaric Way (with background)

Searched words: 
theme views CCK imagefield with imagecache

Note that Views and CCK's imagefield module have excellent imagecache integration and you only need these steps if you want very fine-grained control-- in our case, automatically populating the ALT text of the image with the node title.

/admin/build/views/wizard

and

http://agaricdesign.com/note/how-theme-lots-views-agaric-way

and then a little

<?php
print '<pre>';
print_r(get_defined_vars());
print
'</pre>';
?>

Show us what we have and what we want:


  • EK_Promos_350.gif

    Array
    (
    [file] => themes/changents2/views-list-promo_badges_main.tpl.php
    [variables] => Array
    (
    [view] => stdClass Object
    (
    [vid] => 10
    [name] => promo_badges_main
    [description] => Promo units main block display.
    // ...
    [argument] => Array
    (
    )

    [field] => Array
    (
    [0] => Array
    (
    [vid] => 10
    [tablename] => node
    [field] => title
    [label] =>
    [handler] => views_handler_field_nodelink
    [sortable] => 0
    [defaultsort] => 0
    [options] => nolink
    [position] => 0
    [fullname] => node.title
    [id] => node.title
    [queryname] => node_title
    )

    [1] => Array
    (
    [vid] => 10
    [tablename] => node_data_field_link
    [field] => field_link_url
    [label] =>
    [handler] => content_views_field_handler_ungroup
    [sortable] => 0
    [defaultsort] => 0
    [options] => plain
    [position] => 1
    [fullname] => node_data_field_link.field_link_url
    [id] => node_data_field_link.field_link_url
    [queryname] => node_data_field_link_field_link_url
    )

    [2] => Array
    (
    [vid] => 10
    [tablename] => node_data_field_promo_graphic
    [field] => field_promo_graphic_fid
    [label] =>
    [handler] => content_views_field_handler_ungroup
    [sortable] => 0
    [defaultsort] =>
    [options] => sidebar_default
    [position] => 2
    [fullname] => node_data_field_promo_graphic.field_promo_graphic_fid
    [id] => node_data_field_promo_graphic.field_promo_graphic_fid
    [queryname] => node_data_field_promo_graphic_field_promo_graphic_fid
    )

    )

    [filter] => Array
    (
    [0] => Array
    (
    [vid] => 10
    [tablename] =>
    [field] => nodequeue_nodes.qid
    [value] => Array
    (
    [0] => 1
    )

    [operator] => OR
    [options] =>
    [position] => 0
    [id] => nodequeue_nodes.qid
    )

    )

    [exposed_filter] => Array
    (
    )

    [build_type] => block
    [type] => list
    [pager_limit] => 5
    [current_page] => 0
    [offset] => 0
    [num_rows] => 1
    [real_url] => nodequeue/1
    )

    [view_type] => block
    [node] => stdClass Object
    (
    [nid] => 10429
    [nodequeue_nodes_position] => 1
    [node_title] => Meet the Earthkeepers: Go behind the scenes with Agent 350!
    [node_changed] => 1217726304
    [node_data_field_link_field_link_url] => earthkeepers
    [node_data_field_link_field_link_title] =>
    [node_data_field_link_field_link_attributes] => N;
    [node_data_field_promo_graphic_field_promo_graphic_fid] => 2859
    [node_data_field_promo_graphic_field_promo_graphic_title] => EK_Promos_350.gif
    [node_data_field_promo_graphic_field_promo_graphic_alt] => EK_Promos_350.gif
    )

    [count] => 0
    [stripe] => odd
    [title] => Meet the Earthkeepers: Go behind the scenes with Agent 350!
    [title_label] =>
    [field_link_url] => earthkeepers
    [field_link_url_label] =>
    [field_promo_graphic_fid] => EK_Promos_350.gif
    [field_promo_graphic_fid_label] =>
    [zebra] => odd
    [id] => 1
    [directory] => themes/changents2
    [is_front] => 1
    )

    [view] => stdClass Object
    (
    [vid] => 10
    [name] => promo_badges_main
    [description] => Promo units main block display.
    [access] => Array
    (
    )

    [page] => 0
    [page_title] =>
    [page_header] =>
    [page_header_format] => 1
    [page_empty] =>
    [page_empty_format] => 1
    [page_footer] =>
    [page_footer_format] => 1
    [page_type] => teaser
    [use_pager] =>
    [nodes_per_page] => 10
    [url] => nodequeue/1
    [menu] => 0
    [menu_tab] => 0
    [menu_tab_weight] => 0
    [menu_title] =>
    [menu_tab_default] => 0
    [menu_tab_default_parent_type] => tab
    [menu_parent_title] =>
    [menu_parent_tab_weight] => 0
    [block] => 1
    [block_title] =>
    [block_use_page_header] => 0
    [block_header] =>
    [block_header_format] => 1
    [block_use_page_footer] => 0
    [block_footer] =>
    [block_footer_format] => 1
    [block_use_page_empty] => 0
    [block_empty] =>
    [block_empty_format] => 1
    [block_type] => list
    [nodes_per_block] => 5
    [block_more] => 0
    [breadcrumb_no_home] => 0
    [changed] => 1217729037
    [view_args_php] =>
    [is_cacheable] => 1
    [sort] => Array
    (
    [0] => Array
    (
    [vid] => 10
    [position] => 0
    [field] => nodequeue_nodes.position
    [sortorder] => ASC
    [options] =>
    [tablename] =>
    [id] => nodequeue_nodes.position
    )

    )

    [argument] => Array
    (
    )

    [field] => Array
    (
    [0] => Array
    (
    [vid] => 10
    [tablename] => node
    [field] => title
    [label] =>
    [handler] => views_handler_field_nodelink
    [sortable] => 0
    [defaultsort] => 0
    [options] => nolink
    [position] => 0
    [fullname] => node.title
    [id] => node.title
    [queryname] => node_title
    )

    [1] => Array
    (
    [vid] => 10
    [tablename] => node_data_field_link
    [field] => field_link_url
    [label] =>
    [handler] => content_views_field_handler_ungroup
    [sortable] => 0
    [defaultsort] => 0
    [options] => plain
    [position] => 1
    [fullname] => node_data_field_link.field_link_url
    [id] => node_data_field_link.field_link_url
    [queryname] => node_data_field_link_field_link_url
    )

    [2] => Array
    (
    [vid] => 10
    [tablename] => node_data_field_promo_graphic
    [field] => field_promo_graphic_fid
    [label] =>
    [handler] => content_views_field_handler_ungroup
    [sortable] => 0
    [defaultsort] =>
    [options] => sidebar_default
    [position] => 2
    [fullname] => node_data_field_promo_graphic.field_promo_graphic_fid
    [id] => node_data_field_promo_graphic.field_promo_graphic_fid
    [queryname] => node_data_field_promo_graphic_field_promo_graphic_fid
    )

    )

    [filter] => Array
    (
    [0] => Array
    (
    [vid] => 10
    [tablename] =>
    [field] => nodequeue_nodes.qid
    [value] => Array
    (
    [0] => 1
    )

    [operator] => OR
    [options] =>
    [position] => 0
    [id] => nodequeue_nodes.qid
    )

    )

    [exposed_filter] => Array
    (
    )

    [build_type] => block
    [type] => list
    [pager_limit] => 5
    [current_page] => 0
    [offset] => 0
    [num_rows] => 1
    [real_url] => nodequeue/1
    )

    [view_type] => block
    [node] => stdClass Object
    (
    [nid] => 10429

    [nodequeue_nodes_position] => 1
    [node_title] => Meet the Earthkeepers: Go behind the scenes with Agent 350!
    [node_changed] => 1217726304
    [node_data_field_link_field_link_url] => earthkeepers
    [node_data_field_link_field_link_title] =>
    [node_data_field_link_field_link_attributes] => N;
    [node_data_field_promo_graphic_field_promo_graphic_fid] => 2859
    [node_data_field_promo_graphic_field_promo_graphic_title] => EK_Promos_350.gif
    [node_data_field_promo_graphic_field_promo_graphic_alt] => EK_Promos_350.gif
    )

    [count] => 0
    [stripe] => odd
    [title] => Meet the Earthkeepers: Go behind the scenes with Agent 350!
    [title_label] =>
    [field_link_url] => earthkeepers
    [field_link_url_label] =>
    [field_promo_graphic_fid] => EK_Promos_350.gif
    [field_promo_graphic_fid_label] =>
    [zebra] => odd
    [id] => 1
    [directory] => themes/changents2
    [is_front] => 1
    )

add in some knowledge from theming CCK the Agaric way

Resolution

If you think like we do you'll have something like this in template.php:

<?php
/**
* Theme views invoked by view-specific callbacks (see below).
*/
function phptemplate_views_template($template, &$view, &$nodes, &$type) {
 
$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,
  );

 

$items = array();
  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('views-list-' . $template, $vars);
  }
  if (
$items) {
    return
theme('item_list', $items);
  }
}

/**
* Create functions to catch views' check for theme overrides, and
* pass on to a general function to call templates to output views.
*
* assumed faster than checking if a .tpl.php file exists for every view?
*/
function phptemplate_views_view_list_promo_badges_main(&$view, &$nodes, &$type) {
  return
phptemplate_views_template('promo_badges_main', $view, $nodes, $type);
}
function
phptemplate_views_view_list_promo_badges_earthkeepers(&$view, &$nodes, &$type) {  // yeah so it's not perfectly named anymore
 
return phptemplate_views_template('promo_badges_main', $view, $nodes, $type);
}
?>

And the real excitement in views-list-promo_badges_main.tpl.php, with both files in your active theme directory, of course:

<p><a href="<?php print $field_link_url ?>">
<?php
if (function_exists('_imagefield_file_load')) {
 
$file = _imagefield_file_load($node->node_data_field_promo_graphic_field_promo_graphic_fid);
  print
theme('imagecache', 'sidebar', $file['filepath'], $title);
}
?>

</a></p>

Comments

Post new comment

The content of this field is kept private and will not be shown publicly.
  • Internal paths in single or double quotes, written as "internal:node/99", for example, are replaced with the appropriate absolute URL or path. Paths to files in single or double quotes, written as "files:somefile.ext", for example, are replaced with the appropriate URL that can be used to download the file.
  • Web page addresses and e-mail addresses turn into links automatically.
  • Allowed HTML tags: <a> <em> <strong> <cite> <code> <ul> <ol> <li> <dl> <dt> <dd> <img> <blockquote> <small> <h2> <h3> <h4> <h5> <h6> <sub> <sup> <p> <br> <strike> <table> <tr> <td> <thead> <th> <tbody> <tt> <output>
  • You may post code using <code>...</code> (generic) or <?php ... ?> (highlighted PHP) tags.
  • Lines and paragraphs break automatically.

More information about formatting options

By submitting this form, you accept the Mollom privacy policy.