Làm cách nào để thêm một lớp vào thẻ cơ thể HTML Wikipedia lập trình?


13

Tôi muốn thêm một lớp CSS tùy chỉnh vào <body>thẻ. Tôi đang sử dụng Drupal 7 / Corolla.

Làm thế nào tôi có thể làm điều đó theo chương trình từ mô-đun tùy chỉnh của mình?

Câu trả lời:


13

Các chức năng tiền xử lý có thể được thực hiện từ các mô-đun và chủ đề.

Hàm tiền xử lý mà bạn cần là hook_preprocess_html()và biến cần đặt $variables['classes_array']là một mảng chứa tất cả các lớp được đặt cho <body>phần tử. Nội dung của tệp html.tpl.php được Drupal sử dụng theo mặc định (nếu chủ đề không sử dụng tệp mẫu khác) là như sau:

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

Trong mô-đun của bạn, bạn chỉ cần thực hiện chức năng tiền xử lý như sau:

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

template_ process () sau đó sử dụng $variables['classes_array']để điền $variables['classes']vào đoạn mã sau:

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

 

Sử dụng chức năng tiền xử lý trong một mô-đun là tốt hơn nếu trang web của bạn sử dụng nhiều hơn một chủ đề hoặc nếu chủ đề được đặt cho trang web của bạn không phải là chủ đề bạn đã tạo. Trong trường hợp này, bạn có thể đặt các lớp CSS tùy chỉnh của mình và không bị mất chúng khi cập nhật chủ đề hoặc chỉ đơn giản là thay đổi chủ đề mặc định được sử dụng bởi trang web của bạn. Nếu trang web của bạn chỉ sử dụng một chủ đề và chủ đề đó là một chủ đề tùy chỉnh bạn đã tạo, thì bạn có thể triển khai chức năng tiền xử lý trong chủ đề tùy chỉnh của mình. Khi bạn duy trì chủ đề, các lớp CSS không bị mất khi cập nhật chủ đề của bạn.


Có, tôi thường xử lý tên mô-đun thông qua pre process_html trong mỗi mô-đun để chủ đề JS có thể phát hiện tính năng nếu muốn.
mpdon Arena

9

thêm vào MODULENAME.module và xóa bộ nhớ cache

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

4

Mặc dù bạn có thể thực hiện việc này thông qua hook_pre process_html, nhưng thường thì bạn sẽ ở một phần hoàn toàn khác trong cơ sở mã của bạn khi bạn cần điều này. Nếu đó là trường hợp thì tôi khuyên bạn nên sử dụng ctools_class_addthay thế:

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

Bạn có thể gọi nó từ bất cứ đâu miễn là hook_pre process_html chưa chạy và các lớp sẽ được thêm vào.


1

Giả sử bạn đang sử dụng mô-đun pathauto để tự động tạo các đường dẫn ngữ nghĩa cho các trang nội dung của bạn dựa trên đường dẫn menu, bạn có thể sử dụng đường dẫn của trang để tạo các lớp bạn đang tìm kiếm:

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

Bạn có thể làm điều này thông qua template_preprocess_html(). Bạn có thể đặt cái này trong template.phpbất cứ nơi nào, chủ đề / chủ đề cơ sở của bạn thấy phù hợp nhất (ví dụ: thư mục tiền xử lý Omega ) hoặc trong một mô-đun tùy chỉnh, tùy thuộc vào điều gì là phù hợp nhất.

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

Mặc dù tên trong tham chiếu API, các hàm theme_preprocesstheme_processhàm có thể được gọi từ các mô-đun, và không chỉ các chủ đề. Tất cả bạn cần làm là đặt tên cho hook để phù hợp với mô-đun của bạn, ví dụ mymodule_preprocess_html().

Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.