CSS

Sometimes, in a Drupal-based site, I want to do something to a certain title with CSS, which is easy if the title is on a node. But what if the title is on a View? Well, I’ve used this simple snippet with success to give the title of the Views page a unique id, allowing you to target it with CSS.

In the page.tpl.php file of your theme, find the area of code where your title is set. Insert the following code above.

<?php 
 $illegal = array("'", ",", " ", "-", "/", "&", ":", ";", "|", "–", "—");
 $uniquetitleid = 'title-'.strtolower(str_replace($illegal, "", $title));
?>

Then, replace the following code (or similar):

<?php 
if ($title): print '<h1 class="'. ($tabs ? ' with-tabs' : '') .'">'. $title .'</h1>'; endif; 
?>

with this:

<?php 
if ($title): print '<h1 id="'.$uniquetitleid.'" class="'. ($tabs ? ' with-tabs' : '') .'">'. $title .'</h1>'; endif; 
?>

This code simply takes the title of the page, strips some characters, converts it to lowercase, and turns it into the unique id for the <h1> element that contains the title. Obviously, this code won’t be very helpful if your title is based on arguments – unless you are wanting to make certain argument-based titles look different for some reason. Let me know what you think.