Drupal 7 preprocess tutorial adding variable to template

Understanding how to use preprocessor in Drupal can be very confusing. In this post we will explore how to achieve adding a variable to a node template file using the preprocessor hook (function). The first thing we need to create is the preprocessor function that has mandatory elements so that Drupal can see the hook (function) when called.

Firstly in your theme file create template.php and add the function below. The function name starts with the theme name in the example below it would be purencool_basic_blog_theme and then the rest of the function name needs to be something that the Drupal API will recognise. We are trying to change something in the node so we will be using the preprocess_node. The last thing to understand about a preprocessor is &$variables the & means when you ask for it in your hook (function) it will work on the variable directly

/**
 * Implements hook_preprocess_HOOK() for node template
 */
function purencool_basic_blog_theme_preprocess_node(&$variables){
  // Initial Function
}

The $variables is really a very very large array and what we are going to do is add something to the array so we can access it on the node template file. In the example below we are adding the variable's to the array by $variables['purencool_blog_day'] the dpm function is a way to see variables and/or arrays in the website you are developing (but you need the development module enabled, I have a howto here if you are not sure what it is and how to do it).

/**
 * Implements hook_preprocess_HOOK() for node template
 */
function purencool_basic_blog_theme_preprocess_node(&$variables){
   // Add my variables to the node array
   $variables['purencool_blog_day'] = "testing to see if it works";

    // test to see if they have been added to the array
   dpm($variables['purencool_blog_day']);
}

Next we need to add the node.tpl into the themes folder and add the purencool_blog_day variable to the template. There is a conceptual gotcha though. In the preprocess hook we added to an array but in the template file it is available as a variable called $purencool_blog_day

// Add to template file
<?php print $purencool_blog_day; ?>

Solution to adding a preprocessor variable to template

Below is my complete solution. This preprocessor code gives me the ability to add to modify the node creation date so that I can format using scss(precompiled css). What the code does is accesses the the node method call created and receives a date stamp that is then modified.

/**
 * Implements hook_preprocess_HOOK() for node template
 */
function purencool_basic_blog_theme_preprocess_node(&$variables){
   // Add my variables to the node array
   $variables['purencool_blog_day'] = "";
   $variables['purencool_blog_month'] = "";
   $variables['purencool_date_time'] = ""; 
   $variables['purencool_blog_day'] = date('d',  $variables['node']->created);
   $variables['purencool_blog_month'] = date('M',  $variables['node']->created);
   $variables['purencool_date_time'] = date('d/m/y',  $variables['node']->created);
  
   // test to see if they have been added to the array
   // dpm($variables['purencool_blog_day']);
   // dpm($variables['purencool_blog_month']);
   // dpm($variables['purencool_date_time']);
}

This is what it looks like in the node template. The advantage of doing it this way is I can format the variable any way I like by printing them into the node.tpl.

<?php print $purencool_date_time; ?>
<?php print $purencool_blog_day; ?>
<?php print $purencool_blog_month; ?> 

The image is an example of how I was able to use the preprocessor variables in the node template. Attached below are the files I used to create what is below. To install the files make sure you add mothership and a sub-theme in sites/all/themes. Then copy the files in to the sub-theme, change the preprocessor function name to the name of your sub-theme and clear you caches twice (here is a howto on clearing cache just in case) and it should display on any node that you have on the website.