web-dev-qa-db-ja.com

プログラムでHTMLの「body」タグにクラスを追加するにはどうすればよいですか？

カスタム CSSクラス を<body>タグに追加したいと思います。 Drupal 7/Corollaを使用しています。

カスタムモジュールからプログラムでどのように実行できますか？

7theming
12
giorgio79

前処理機能は、モジュールおよびテーマから実装できます。

必要な前処理関数はhook_preprocess_html()であり、設定する変数は$variables['classes_array']です。これは、<body>要素に設定されたすべてのクラスを含む配列です。 Drupal（テーマが別のテンプレートファイルを使用しない場合）によってデフォルトで使用される html.tpl.php ファイルの内容は次のとおりです。 ：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML+RDFa 1.0//EN"
  "http://www.w3.org/MarkUp/DTD/xhtml-rdfa-1.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<?php print $language->language; ?>" version="XHTML+RDFa 1.0" dir="<?php print $language->dir; ?>"<?php print $rdf_namespaces; ?>>

<head profile="<?php print $grddl_profile; ?>">
  <?php print $head; ?>
  <title><?php print $head_title; ?></title>
  <?php print $styles; ?>
  <?php print $scripts; ?>
</head>
<body class="<?php print $classes; ?>" <?php print $attributes;?>>
  <div id="skip-link">
    <a href="#main-content" class="element-invisible element-focusable"><?php print t('Skip to main content'); ?></a>
  </div>
  <?php print $page_top; ?>
  <?php print $page; ?>
  <?php print $page_bottom; ?>
</body>
</html>

モジュールでは、次のように前処理関数を実装するだけです。

function mymodule_preprocess_html(&$variables) {
  $variables['classes_array'][] = "new-class";
}

template_process（） 次に、$variables['classes_array']を使用して$variables['classes']に次のコードを入力します。

$variables['classes'] = implode(' ', $variables['classes_array']);

サイトで複数のテーマを使用している場合、またはサイトのテーマセットが作成したテーマではない場合は、モジュールで前処理関数を使用することをお勧めします。この場合、カスタムCSSクラスを設定でき、テーマを更新したり、サイトで使用されるデフォルトのテーマを変更したりしても、それらを失うことはありません。サイトでテーマのみを使用していて、そのテーマが作成したカスタムテーマである場合は、カスタムテーマに前処理機能を実装できます。テーマを維持するとき、テーマを更新してもCSSクラスは失われません。

12
kiamlaluno

mODULENAME.moduleに追加してキャッシュをクリアする

function MODULENAME_preprocess_html(&$vars) {
  $vars['classes_array'][] = 'custom-class';
}
9
xandeadx

これはhook_preprocess_htmlを介して行うことができますが、これが必要になると、コードベースの完全に異なる部分に陥ることがよくあります。その場合は、代わりにctools_class_addを使用することをお勧めします。

ctools_class_add(array('class1', 'class2', 'class3'));

Hook_preprocess_htmlがまだ実行されておらず、クラスが追加されている限り、どこからでも呼び出すことができます。

4
Angry Dan

template_preprocess_html() を使用してこれを行うことができます。これを_template.php_に置くことができます。これは、テーマ/ベーステーマが最も適切であると考えられる場合はどこにでも（例： Omega preprocessフォルダー）、または最も適切なものに応じてカスタムモジュールに配置できます。

_function mytheme_preprocess_html(&$variables) {
  $variables['classes_array'][] = "class1";
  $variables['classes_array'][] = "class2";
  $variables['classes_array'][] = "class3";
}
_

APIリファレンスの名前にもかかわらず、_theme_preprocess_および_theme_process_関数は、テーマだけでなく、モジュールから呼び出すことができます。あなたがする必要があるのはあなたのモジュールにマッチするようにフックに名前を付けることです、例えばmymodule_preprocess_html()。

1
mpdonadio

Pathautoモジュールを使用して、メニューパスに基づいてコンテンツページのセマンティックパスを自動的に作成すると仮定すると、ページのパスを使用して、探しているクラスを作成できます。

function THEMENAME_preprocess_html(&$vars) {
  $path = drupal_get_path_alias();
  $aliases = explode('/', $path);

  foreach($aliases as $alias) {
    $vars['classes_array'][] = drupal_clean_css_identifier($alias);
  } 
}
1
Iqbal