Task

IMPORTANT: In Drupal 6, the theme system caches template files and which theme functions should be called. What that means is if you add a new theme or preprocess function to your template.php file or add a new template (.tpl.php) file to your sub-theme, you will need to rebuild the "theme registry." See http://drupal.org/node/173880#theme-registry

Drupal 6 also stores a cache of the data in .info files. If you modify any lines in your sub-theme's .info file, you MUST refresh Drupal 6's cache by simply visiting the admin/build/themes page.

The base Zen theme is designed to be easily extended by its sub-themes. You shouldn't modify any of the CSS or PHP files in the zen/ folder; but instead you should create a sub-theme of zen which is located in a folder outside of the root zen/ folder. The examples below assume zen and your sub-theme will be installed in sites/all/themes/, but any valid theme directory is acceptable (read the sites/default/default.settings.php for more info.)

Why? To learn why you shouldn't modify any of the files in the zen/ folder, see Why use Zen?

Instead of using the usual page numbers for the pager (1, 2, 3, etc), I wanted to show the number of results i.e. 1-10, 11-20, 21-30, etc. After quite a bit of searching I finally figured out where to do the customizations and how to do it. By theming theme_pager() in includes/pager.inc I managed to get it to work. Maybe someone else will find this useful.

Just remember to change "themename" (in the function name) to the name of your theme, otherwise the override won't work.

<?php
/**
*Override themename_pager()
* Creates a numbered list e.g. 1-10 11-20... instead of the usual page number list i.e. 1 2 3 ...
*/
function themename_pager($tags = array(), $limit = 10, $element = 0, $parameters = array()) {

global $pager_page_array, $pager_total, $pager_total_items;
$page_prev = $pager_page_array[$element] - 1;
$page_curr = $pager_page_array[$element] + 1;
$page_next = $pager_page_array[$element] + 1;
$page_last = $pager_total[$element] - 1;

//Custom Label
$this_pg = $pager_page_array[$element]+1;
$last_pg = $pager_total[$element];
$total = $pager_total_items[0];
$start = $page_curr*10 - 9;
if($this_pg < $last_pg)
$end = $this_pg*10 ;
else
$end = $total;

$label = "Comments $start-$end of $total";
//end of custom label

if ($pager_total[$element] > 1) {

As a quick example:
I needed to customize the HTML for the default search block, which is created by the search module.

To do this using the tpl.php file method:
1. Copy "search-block-form.tpl.php" from Drupal's search module into my theme folder.
2. Modify it.

The original tpl.php had this code:

Following instructions in this file, I removed the simple form print statement there, and changed it to this new HTML output:

Ever wanted to create dynamic CSS? Here's an example of how to render a template based string of CSS that you can populate with variables.
For this example, lets say we want to generate CSS to change the font size of a page title.

1. Create your CSS template (style.css.php):

   @CHARSET "UTF-8";
#content h1.title{ font-size: <?php print $font_size; ?>px;}

2. Write code to render the template and get the resulting string:

   $variables = array(
  'font_size' => 20,
);

extract($variables, EXTR_SKIP);
ob_start();
include('style.css.php');
$css = ob_get_contents();
ob_end_clean();

// the resulting $css variable can be used to include or print the style in various ways:
print '<style type="text/css">'.$css.'</style>';

Generously borrowed from phptemplate

This user_profile.tpl.php show the:

• avatar picture and the "change your avatar" link
• edit profil link
• all of profile fields and values
• user's last 10 contents
• user's last 10 comments with the content name

Before using, you have to change in the code:

• your_profile_category
• your_theme_name

<?php
// Avatar picture
global $user;
if ($account->picture) { print theme('user_picture', $account);

if ($user->uid == $account->uid) {

I was working on one of the themes , which had the following structure :

content this was a good option but again I found it less efficient, as it would render my class1 limited
2. Put a height tag of 1%, IE is notorious in that field --> tried but not worked

3. Put a font-size: 1px; WORKING !!!!

in the class , class 2, just add a new tag
.class 2 , .class 4 { font-size: 1px}

and it worked wonders as if nothing was wrong ever. IE 7+ is happy now.

Final Word : In case you are looking for IE 6 fix, then possibly solution 1 will be helpful.