Jak programowo dodać klasę do znacznika „body” HTML?

13

Chciałbym dodać niestandardową klasę CSS do <body>tagu. Używam Drupal 7 / Corolla.

Jak mogę to zrobić programowo z mojego niestandardowego modułu?

giorgio79
źródło

Odpowiedzi:

13

Funkcje preprocesu mogą być implementowane z modułów i motywów.

Potrzebna jest funkcja przetwarzania wstępnego, hook_preprocess_html()a zmienną do ustawienia jest $variables['classes_array']tablica zawierająca wszystkie klasy ustawione dla <body>elementu. Zawartość pliku html.tpl.php , który jest domyślnie używany przez Drupal (jeśli motyw nie używa innego pliku szablonu), jest następujący:

<!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>

W swoim module po prostu implementujesz funkcję wstępnego przetwarzania w następujący sposób:

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

template_process () następnie używa $variables['classes_array']do wypełnienia $variables['classes']następującego kodu:

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

 

Korzystanie z funkcji wstępnego przetwarzania w module jest preferowane, jeśli witryna używa więcej niż jednego motywu lub jeśli zestaw motywów dla witryny nie jest tym, który utworzyłeś. W takim przypadku możesz ustawić własne klasy CSS i nie stracić ich podczas aktualizacji motywu lub po prostu zmieniając domyślny motyw używany w witrynie. Jeśli Twoja witryna korzysta tylko z motywu, który jest motywem niestandardowym, który utworzyłeś, możesz zaimplementować funkcję wstępnego przetwarzania w niestandardowym motywie. Podczas utrzymywania motywu klasy CSS nie są tracone podczas aktualizacji motywu.

kiamlaluno
źródło
Tak, zazwyczaj wpisuję nazwę modułu za pomocą preprocess_html w każdym module, aby motyw JS mógł wykryć w razie potrzeby.
mpdonadio
9

dodaj do MODULENAME.module i wyczyść pamięć podręczną

function MODULENAME_preprocess_html(&$vars) {
  $vars['classes_array'][] = 'custom-class';
}
xandeadx
źródło
4

Chociaż możesz to zrobić za pomocą hook_preprocess_html, dość często znajdziesz się w zupełnie innej części bazy kodu, gdy będziesz tego potrzebować. Jeśli tak jest, sugeruję użycie ctools_class_addzamiast tego:

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

Możesz to nazwać z dowolnego miejsca, o ile nie uruchomiono jeszcze hook_preprocess_html, a klasy zostaną dodane.

Angry Dan
źródło
1

Zakładając, że używasz modułu pathauto do automatycznego tworzenia ścieżek semantycznych dla swoich stron z treścią na podstawie ścieżki menu, możesz użyć ścieżki strony do utworzenia poszukiwanych klas:

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);
  } 
}
Iqbal
źródło
1

Możesz to zrobić za pośrednictwem template_preprocess_html(). Możesz umieścić to w swoim template.php, tam gdzie twój motyw / motyw podstawowy uzna za najbardziej odpowiedni (np. Folder wstępnego przetwarzania Omega ) lub w niestandardowym module, w zależności od tego, co jest najbardziej odpowiednie.

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

Pomimo nazw w odwołaniu do API, funkcje theme_preprocessi theme_processmożna wywoływać z modułów, a nie tylko z motywów. Wszystko, co musisz zrobić, to nazwać hak pasujący do modułu, np mymodule_preprocess_html().

mpdonadio
źródło