Ever used the Drupal CCK Module? You will know how powerful the module is. Wielding its power as a Drupal themer is essential to really make your site look polished. In this article I will describe how to theme a custom CCK node.

Create Custom CCK Nodes

Lets assume that you want to have two special Drupal nodes that show a pie chart and a bar chart. You go into the Content Types link and create both custom types.

Now, you may be scratching your head at this point. Here you have two wonderful CCK custom nodes created but how are you going to theme it?

The trick is to create a template.php file that hooks the node processing for your theme:


template.php
--------------
function drop_preprocess_node(&$variables) {
/* hook to route to blog node */
if ($variables['node']->type == "blog") {
$variables['template_files'][] = 'node-blog';
}
/* hook to route to piechart node */
if ($variables['node']->type == "piechart") {
$variables['template_files'][] = 'node-piechart';
}
/* hook to route to barchart node */
if ($variables['node']->type == "barchart") {
$variables['template_files'][] = 'node-barchart';
}
}


Then, create your templates and name their file appropriately. For example, the blog node template would have the filename node-blog.tpl.php. The barchart and piechart nodes would be named node-barchart-tpl.php and node-piechart.tpl.php respectively.

Your blog node template could look something like this:


// Div Param
$divParams = "";
if ($sticky) {
$divParams .= " sticky";
}
if (!$status) {
$divParams .= " node-unpublished";
}
// Prelude
$prelude = "


";
if ($teaser) {
$prelude .= "" . $title . "";
}
else {
$prelude .= $title;
}
$prelude .= "

";


Create Custom CCK Pages

Now if you wanted to create custom pages for your CCK content types, you can do so also. This is useful when rendering a ist of CCK nodes. For example, if you go to user blog page you can customize that page by doing the following:


template.php
-------------
function drop_preprocess_page(&$variables) {
/* hook to route to blog page */
if ($variables['node']->type == "blog") {
$variables['template_files'][] = 'page-blog';
}
/* hook to route to piechart page */
if ($variables['node']->type == "piechart") {
$variables['template_files'][] = 'page-piechart';
}
/* hook to route to barchart page */
if ($variables['node']->type == "barchart") {
$variables['template_files'][] = 'page-barchart';
}
}


Then create your template filenames (page-blog.tpl.php, page-piechart.tpl.php, page-barchart.tpl.php).

Your page-blog.tpl.php could look something like this:

language) ?>" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">




<?php echo $closure ?>




And there you have it. You now know how to customize default pages and nodes as well as CCK content type pages and nodes.