【Drupal】为 theme_box 添加个性 class 以方便定制 CSS 样式外观

在 Drupal 中有很多预定义的 theme 函数(在 theme.inc 中)而多数主题函数在渲染时并没有过多的考虑前端的 CSS 样式定义及呈现问题,其中 theme_box 就是其中之一,在 Drupal 中默认的“评论表单”及“搜索结果”就使用 theme(‘box’) 函数渲染,但如果想区分对待,分别定义不同的 CSS 样式会发现相当困难,这里提供一个简单的覆写主题函数的方法来为 theme_box 添加额外的 class 以方便前端附加个性的 CSS 样式。

做 Drupal 开发最基本的原则就是避免修改核心代码,所以我在主题模板的 template.php 文件添加如下代码:

function anyLiv_box( $title, $content, $region = 'main' ){
	$output  = '
'; $output .= '

'. $title .'

'; $output .= '
'. $content .'
'; $output .= '
'; return $output; }

其中的 anyLiv 换成你的主题名称。这里除给整个 box 外面添加一个 div 以外还额外添加了 class 其中 box 可用来定义 box 的整体外观,而后面根据 $title md5 之后生成的四个字符用来定义个别 box 的外观,因为通常 box 的 title 能决定这个 box 的功能。

做完上述工作查看代码会发现评论表单即“发表新评论”已经包含了 box box-812b 两个 class 而使用 theme_box 渲染的“搜索结果”已经包含了 box box-1f1b 两个 class 这样就可以很方便的分别使用 CSS 为“发表新评论”和“搜索结果”定制外观了。

缺点:虽然没有涉及修改核心代码,并且暂时解决了问题,但这种方法并非推荐的做法,毕竟 MD5 运算需要消耗服务器资源,当然使用其他运算都是可以的如 CRC32 等等,只要输出的结果符合 class 的命名规则即可。

拓展:其实这种方法还可以用在 theme_links 函数上为每一个链接定义单独的 class 这样可以方便为每个链接定义不同的 CSS 背景图标等等。