web-dev-qa-db-ja.com

ボイラープレートの<html>要素の条件付きクラス

これはまったくありふれた質問かもしれませんが、私はそうは思いません。

ボイラープレートのようなテーマの<html>要素に条件付きクラスを追加したい。私は事をきちんと保ち、私のpage.tpl.phpを複雑にしたくないです。

<?php
  $htmlvar = 'xmlns="http://www.w3.org/1999/xhtml" xml:lang="' .
    $language->language . '" lang="' .
    $language->language . '" dir="'. $language->dir .'"';
?>

<!--[if lt IE 7 ]> <html class="ie6" <?php print $htmlvar ?>> <![endif]-->
<!--[if IE 7 ]>    <html class="ie7" <?php print $htmlvar ?>> <![endif]-->
<!--[if IE 8 ]>    <html class="ie8" <?php print $htmlvar ?>> <![endif]-->
<!--[if (gte IE 9)|!(IE)]><!--> <html <?php print $htmlvar ?>> <!--<![endif]-->

反応？提案？挑発？

theming
3
d3l3t3m3

Drupal 7の Zentropy 基本テーマがこれを行います、これがライブデモです： http://d7.webdrop.net .br /

そうは言っても、私はテーマの唯一のメンテナーであるため、すべての開発努力がDrupal 6バックポート、 こちらgithub にあります。また、この機能は最終的にD6バックポートから削除されました。

2
Alex Weber

Drupal 7修正 drupal_add_css() テンプレートファイルの外部に条件付きCSSを追加できるようにするための実際の良い方法はありませんが、 Drupal 6には何もありません。

Drupal 6で、任意の条件付きHTMLの場合、マークアップを _page.tpl.php_ に直接追加する必要があります。または、テーマの変数を作成できます。関連するマークアップを文字列として含む template_preprocess_page() の実装：

Drupal 7

_function foo_preprocess_html(&$variables) {
  $htmlvar = 'xmlns="http://www.w3.org/1999/xhtml" xml:lang="' .
    $variables['language']->language . '" lang="' .
    $variables['language']->language . '" dir="'. $language->dir .'"';

  $variables['conditional_html'] = '<!--[if lt IE 7 ]> <html class="ie6"' . $htmlvar . '> <![endif]-->';
  // Concactenate the rest of the conditional HTML here
}
_

次に、_$condtional_html_の適切な場所に_html.tpl.php_を追加します。

Drupal 6

_function foo_preprocess_page(&$variables) {
  $htmlvar = 'xmlns="http://www.w3.org/1999/xhtml" xml:lang="' .
    $variables['language']->language . '" lang="' .
    $variables['language']->language . '" dir="'. $language->dir .'"';

  $variables['conditional_html'] = '<!--[if lt IE 7 ]> <html class="ie6"' . $htmlvar . '> <![endif]-->';
  // Concactenate the rest of the conditional HTML here
}
_

次に、_$condtional_html_の適切な場所に_page.tpl.php_を追加します。

Drupal 7の条件付きCSS処理に興味がある場合は、Bartikの template_preprocess_html() の実装例をご覧ください。

_function bartik_preprocess_html(&$variables) {
  // ...

  // Add conditional stylesheets for IE
  drupal_add_css(path_to_theme() . '/css/ie.css', array('group' => CSS_THEME, 'browsers' => array('IE' => 'lte IE 7', '!IE' => FALSE), 'preprocess' => FALSE));
  drupal_add_css(path_to_theme() . '/css/ie6.css', array('group' => CSS_THEME, 'browsers' => array('IE' => 'IE 6', '!IE' => FALSE), 'preprocess' => FALSE));
}
_
2
user7

ブラウザクラスモジュールはここに行く方法です：

http://drupal.org/project/browserclass

例：

<body class="... chrome chrome11 mac desktop">
...
</body>

サポートされているブラウザ

つまり、オペラ、サファリ、クロム、ネットスケープ、ff、konqueror、ディロ、キメラ、beonex、aweb、amaya、icab、lynx、galeon、operamini

ブラウザのバージョンチェック

モジュールはバージョンクラスを作成します。

ie [バージョン]、opera [バージョン]、chrome [バージョン]、safari [バージョン]、netscape [バージョン]、ff [バージョン]、konqueror [バージョン]、operamini [バージョン]

サポートされているプラ​​ットフォーム

win、ipad、iPod、iphone、mac、Android、linux、nokia、blackberry、NetBSD、FreeBSD、OpenBSD

モバイル検出

モジュールはデバイスがモバイルかどうかをチェックし、「モバイル」または「デスクトップ」クラスを追加します。

1
Olivier