Community Documentation

Replacing certain taxonomy terms with icons

Last updated October 9, 2010. Created by ugerhard on June 6, 2007.
Edited by siliconmeadow, ronald_istos, adrinux, aclight. Log in to edit this page.

Description

This describes how to replace the display of certain taxonomy terms in the taxonomy terms list with image icons. You may find Taxonomy Image provides more features.

Step 1 of 2

In the template.php file of your theme directory, add the following function.

<?php
/**
* Replace display of certain taxonomy terms in taxonomy term list
* with icons.
*/
function phptemplate_links($links, $attributes = array('class' => 'links')) {
 
// configuration for this function:
 
$replacements = array();
 
 
// create a new element in array $replacements for each taxonomy term that will be replaced by
  // an image (only when it's in a class containing 'inline' and 'links', such as the $terms list.
  // In the replacements array, add any attributes you want in the <img> tag, such as 'src' and 'alt'
 
  // Mac-Intel
 
$replacements['taxonomy_term_2'] = array(
   
'src' =>  '/files/images/icons/mactel_icon.png',
   
'alt' =>  'Macintosh-Intel',
   
'id'  =>  'mac-intel',
   
'width' =>  '25',
   
'height'  =>  '25',
   
'class' =>  'taxonomy_image',
    );
 
 
// Mac-PPC
 
$replacements['taxonomy_term_13'] = array(
   
'src' =>  '/files/images/icons/macppc_icon.png',
   
'alt' =>  'Macintosh-PPC',
   
'id'  =>  'mac-ppc',
   
'width' =>  '25',
   
'height'  =>  '25',
   
'class' =>  'taxonomy_image',
    );

 
// Windows
 
$replacements['taxonomy_term_3'] = array(
   
'src' =>  '/files/images/icons/win_icon.png',
   
'alt' =>  'Windows',
   
'id'  =>  'windows',
   
'width' =>  '25',
   
'height'  =>  '25',
   
'class' =>  'taxonomy_image',
    );
   
 
// END OF CONFIGURATION
 
  // modify the links if class contains both 'links' and 'inline'
  // because these might be linked taxonomy terms
 
if (strstr($attributes['class'], 'links') && strstr($attributes['class'], 'inline')) {
    foreach (
$links as $key => $link) {
      if (
array_key_exists($key, $replacements)) {
       
// create image html code and then pass that as the content instead
        // of the title so that the image will be a link       
       
$img_tag = '<img ';
        foreach (
$replacements[$key] as $img_key => $img_attr_value) {
         
$img_tag .= $img_key. '= "' .$img_attr_value. '" ';
        }
       
$img_tag .= '/>';
       
$links[$key]['title'] = $img_tag;
       
$links[$key]['html'] = TRUE;
      }
    }
  }
  return
theme_links($links, $attributes); 
}
?>

Step 2 of 2

Now you need specify which taxonomy terms should be replaced, and what the img tag attributes should be for that replacement. You do this by adding or removing elements of the $replacements array, as seen in the snippet above. The example code here replaces taxonomy terms for operating system compatibility with an icon.

Taxonomy terms that do not match terms in the $replacements array will be left alone.

Notes

  • In the snippet above, this line:
    <?php
    if (strstr($attributes['class'], 'links') && strstr($attributes['class'], 'inline')) {
    ?>

    restricts replacement of taxonomy terms to ONLY the list of terms printed on the actual node. This is the code produced by the line
    <div class="terms"><?php print $terms ?></div>

    in the node.tpl.php file.

About this page

Drupal version
Drupal 5.x
Audience
Designers/themers, Programmers

Theming Guide

Drupal’s online documentation is © 2000-2013 by the individual contributors and can be used in accordance with the Creative Commons License, Attribution-ShareAlike 2.0. PHP code is distributed under the GNU General Public License. Comments on documentation pages are used to improve content and then deleted.
nobody click here