6.3 用drupal_add_css加载css(上) Load CSS with Drupal_add_css (I)
虽然在本章第一节中我们不提倡使用谷歌cdn,但是这并不影响我们学习使用drupal_add_css,因为它非常强大,而且还能帮我们实现有条件的加载样式表的需求。所以,让我们接着上一节继续学习。具体请查看官网文档,以下只举几个例子:
如果你想只在首页加载某个样式表,你可以在template.php文件中写以下代码:
function mytheme_preprocess_html(&$variables) { // Add a stylesheet that prints only on the homepage. if ($variables['is_front']) { drupal_add_css(path_to_theme() . '/css/homepage.css', array('weight' => CSS_THEME)); } }
在Seven主题中,通过下面的代码针对IE添加带有条件判断的样式表:
function seven_preprocess_html(&$variables) { // Add conditional CSS for IE8 and below. drupal_add_css(path_to_theme() . '/ie.css', array('group' => CSS_THEME, 'browsers' => array('IE' => 'lte IE 8', '!IE' => FALSE), 'preprocess' => FALSE)); // Add conditional CSS for IE6. drupal_add_css(path_to_theme() . '/ie6.css', array('group' => CSS_THEME, 'browsers' => array('IE' => 'lt IE 7', '!IE' => FALSE), 'preprocess' => FALSE)); }
最终生成的代码如下:
<!--[if lte IE 8]> <link type="text/css" rel="stylesheet" href="http://drupal-7/themes/seven/ie.css?l40z2j" media="all" /> <![endif]--> <!--[if lt IE 7]> <link type="text/css" rel="stylesheet" href="http://drupal-7/themes/seven/ie6.css?l40z2j" media="all" /> <![endif]—>
当然,你还可以使用 conditional_styles模块来为IE添加基于浏览器版本的样式表。
在bartik主题中,使用drupal_add_css为某特定内容类型添加特定样式表:
function bartik_preprocess_node(&$variables) { if(!empty($variables['node'])) { if($variables['node']->type == 'my_custom_content_type') { drupal_add_css(drupal_get_path('theme', 'any_theme_name') . "/css/foo.css"); } } // Some other code here }
以下代码判断用户是否登陆,如果是登陆的注册用户则加载注册用户对应的样式表authenticated-users.css:
<?php function YOURTHEME_preprocess_html(&$variables) { // An anonymous user has a user id of zero. 匿名用户的id为0. if ($user->uid > 0) { //所以当用户id大于0时,加载css drupal_add_css(path_to_theme() . '/css/authenticated-users.css', array('group' => CSS_THEME)); } }
标签
Drupal 版本
感谢分享~~~
这节中的很多条件判断对于新手来说非常有用,非常感谢。