Làm thế nào để thêm lớp .active vào mục menu?

Tôi đang phát triển một chủ đề cho Drupal 7 và tôi gặp phải vấn đề sau. Tôi có thể thấy có các bản sửa lỗi thông qua jQuery. Nhưng tôi muốn làm theo cách của Drupal.

HTML hiện tại của tôi

<ul class="menu sf-js-enabled">
<li class="first leaf">
    <a href="/" class="active">Home</a></li>
<li class="last expanded">
    <a href="/node/57">About Us</a>
        <ul class="menu sf-js-enabled" style="display: none; visibility: hidden;">
            <li class="first leaf"><a href="/node/69">Contact Us</a></li>
            <li class="last leaf"><a href="/node/73">Typhygraphy</a></li>
        </ul>
</li>

Và tôi muốn một cái gì đó như thế này

<ul class="menu sf-js-enabled">
<li class="first leaf active">
    <a href="/" class="active">Home</a></li>
<li class="last expanded">
    <a href="/node/57">About Us</a>
        <ul class="menu sf-js-enabled" style="display: none; visibility: hidden;">
            <li class="first leaf"><a href="/node/69">Contact Us</a></li>
            <li class="last leaf"><a href="/node/73">Typhygraphy</a></li>
        </ul>
</li>

Lớp "hoạt động" cũng cần phải có trong đó <li>.

Bạn có thể đạt được mục tiêu của mình mà không cần jQuery. Chỉ cần sử dụng hàm theme_menu_link () hoặc (đề xuất của tôi) theme_menu_link__your_menu ()

Đặt chức năng này trong tệp template.php của bạn:

function YOURTHEME_menu_link(array $variables) {
    $element = $variables['element'];
    $sub_menu = '';

    if ($element['#below']) {
        $sub_menu = drupal_render($element['#below']);
    }
    $output = l($element['#title'], $element['#href'], $element['#localized_options']);

    // if link class is active, make li class as active too
    if(strpos($output,"active")>0){
        $element['#attributes']['class'][] = "active";
    }
    return '<li' . drupal_attributes($element['#attributes']) . '>' . $output . $sub_menu . "</li>\n";
}

Bạn chỉ có thể sử dụng chức năng này cho các menu được hiển thị dưới dạng một khối. Nếu bạn đang theo chủ đề menu chính:

1. đi đến admin/appearance/settings/yourthemevà tắt menu chính.
2. đi đến admin/structure/blockvà đặt khối menu chính trong vùng tiêu đề
3. tùy chỉnh ul với các phần tử theme_menu_tree () và li với theme_menu_link ()