In my role as a web designer at the Idaho Commission for Libraries, I design Drupal themes for our e-Branch in a Box project. On my most recent theme, I wanted to use a gradient background with rounded corners for the block titles. Since we run a multi-site setup, I was a little bit apprehensive to use a jquery solution and ended up using a background image instead. The problem with this technique is that when the block titles are too long, it would wrap around and not align in the image correctly. Since this was a theme for sites that I do not do the day to day maintenance for, I needed a way to catch the titles (the unknown) before they were printed out to the screen and shrink them up a bit. Template.php to the rescue!
Since all blocks are themeable, I went to the Drupal API and looked up the theme_block function. Next, I copied and pasted the function into my Template.php file and made the following modifications:
<?php
function theme_block($block) {
$output = "<div class=\"block block-$block->module\" id=\"block-$block->module-$block->delta\">\n";
// 12/07/07 -- ejhildreth. In an attempt to keep long block titles from
// breaking the layout, I am checking the string length and trimming off the
// excess and adding an ellipsis mark to give the user a visual clue about this override
if (strlen($block->subject) >= 19) {
$output .= " <h2 class=\"title\">" . substr($block->subject, 0, 18) . " …</h2>\n";
} else {
$output .= " <h2 class=\"title\">$block->subject</h2>\n";
}
$output .= " <div class=\"content\">$block->content</div>\n";
$output .= "</div>\n";
return $output;
}
?>Basically, I added an if/else statement to add an ellipsis mark if my block title was greater than 19 characters (this number was based on the font size I used for the theme). First, I needed to find out the length of the string that was being passed to the block title and used PHP's strlen() function for use in my conditional. If strlen() returns true, then I strip off all the remaining characters from the string that are greater than 19 by using the substr() function. The substr() function allows you to take a string, and remove the unwanted parts and pieces leaving only the data you want. In this example, I wanted the first 18 characters and didn't care about the rest.
Since I was handling all of this in code, I didn't want to confuse my end user by having a block title that just stopped abruptly. Therefore, I turned to the symbol for intentional omissions, the ellipsis mark. The HTML character encoding for the ellipsis mark is … and I placed it at the end of the line to give the user a visual clue about what I had done.