将 ID 添加到 drupal 主菜单中的菜单项

Question

附加到我从切片器收到的模板中，有一个用于为菜单项着色的 javascript 文件。 现在我需要将模板转换为 Drupal 模板。 javascript基于每个菜单项都有一个id，根据项目的顺序。 在 Drupal 中，菜单项只有类（menu-341、menu-342 等）。我知道我可以调整 javascript，因此它按类获取菜单项，但实际上是不可能的，因为我需要完全打乱整个文件，这是我试图阻止的。

那么我可以为我的所有主菜单项添加一个 ID，例如“menu-item-1”、“menu-item-2”等吗？ 我应该在template.tpl.php中这样做，还是直接更改page.tpl.php中的输出？

感谢您的帮助。

编辑： 我很绝望，因为我只是不知道如何解决这个问题。还有其他方法可以为我的菜单项着色吗？ 我正在使用的脚本在它们的升序 id (custom-menu-item-id-x) 上选择菜单项，并从数组中为它们提供一个背景，该背景与 ID 的“x”相关联。四种颜色：第 1 项的颜色 1、第 2 项的颜色 2、第 5 项的颜色 1 等..... 没有其他方法可以解决这个问题吗？我不能让 jQuery 按升序自动选择它们吗（它遇到的第一个项目获得第一个背景，第二个项目获得第二个背景等）？请提出想法。在我看来，我什么都试过了。

这是我当前的脚本：

//Sequence of the background colors from the menu items, from left to right.
var backgrounds = ["blue", "green", "pink", "purple"];

//Gives the menu items a style when hovering over it, in the sequence of the setting in the variable 'backgrounds', on top.
jQuery(document).ready(function MenuColor($){
    for (var i = 0; i <= 10 ; i++) {
        document.getElementById("custom-menu-item-id-" + (i + 1)).onmouseover = (function(valueOfI){ return function() {
        this.style.background = "url('images/" +  backgrounds[(valueOfI % backgrounds.length)] + ".jpg')";
        }; })(i);
        var ActiveLi = $('.active').attr('id');
        if("custom-menu-item-id-" + (i + 1) != ActiveLi) {
            document.getElementById("custom-menu-item-id-" + (i + 1)).onmouseout = function() {
                this.style.background = 'none'; 
            }
        }
    }
});

Answer 1

A quick search 提供了几个选项，包括看起来像 answer 的选项。是的 - 模板功能是 100% 为这类事情设计的。 :)

编辑 - 没问题，但您的答案实际上在 RichTheGeek 的评论中。他链接了新的 D7 功能，并且在评论线程中是一个示例，它根据菜单项的标题向菜单项添加类。这不是一个很好的例子，因为使用 preg_replace 是一种“繁重”的方式，但我不明白为什么这不起作用。我所做的只是在第 11 行将“class”替换为“id”。

不要忘记将“yourtheme”替换为您正在使用的主题的实际系统名称。

  function yourtheme_menu_link(array $variables) {
  $element = $variables['element'];
  $sub_menu = '';
  $name_id = strtolower(strip_tags($element['#title']));
// remove colons and anything past colons
  if (strpos($name_id, ':')) $name_id = substr ($name_id, 0, strpos($name_id, ':'));
//Preserve alphanumerics, everything else goes away
  $pattern = '/[^a-z]+/ ';
  $name_id = preg_replace($pattern, '', $name_id);
  $element['#attributes']['id'][] = 'menu-' . $element['#original_link']['mlid'] . ' '.$name_id;
  if ($element['#below']) {
    $sub_menu = drupal_render($element['#below']);
  }
  $output = l($element['#title'], $element['#href'], $element['#localized_options']);
  return '<li' . drupal_attributes($element['#attributes']) . '>' . $output . $sub_menu . "</li>\n";
}
?>

Answer 2

但我最终还是自己解决了。 首先，我将这段代码（从 Bartik page.tpl.php 模板复制）粘贴到我的 page.tpl.php 中：

<?php if ($main_menu): ?>
  <div id="main-menu" class="navigation">
    <?php print theme('links__system_main_menu', array(
      'links' => $main_menu,
      'attributes' => array(
        'id' => 'main-menu-links',
        'class' => array('links', 'clearfix'),
      ),
      'heading' => array(
        'text' => t('Main menu'),
        'level' => 'h2',
        'class' => array('element-invisible'),
      ),
    )); ?>
  </div> <!-- /#main-menu -->
<?php endif; ?>

这将“主菜单”放置在正确的位置。 但是，我在 menu.inc 或 template.php 中更改的所有内容都不适用于它。 因此，我没有将代码放在那里，而是将 BLOCK 的“主菜单”放在相应的区域中，突然间我就可以更改所有内容了。

所以在我的 template.php 中我添加了这个函数，将 ID 写入项目。

<?php
/**
 * Returns HTML for a menu link and submenu.
 *
 * @param $variables
 *   An associative array containing:
 *   - element: Structured array data for a menu link.
 *
 * @ingroup themeable
 */
function exofes_menu_link(array $variables) {
  $element = $variables['element'];
  $sub_menu = '';

  if ($element['#below']) {
    $sub_menu = drupal_render($element['#below']);
  }
  static $item_id = 0;
  $output = l($element['#title'], $element['#href'], $element['#localized_options']);  
  return '<li id="custom-menu-item-id-' . (++$item_id) . '"' . drupal_attributes($element['#attributes']) . '>' . $output . $sub_menu . "</li>\n";
}
?>

并且成功了：D！

Answer 3

function THEME_preprocess_page(&$vars) {
  $menu = menu_navigation_links('menu-your-custom-menu-name');
  $vars['custom_menu'] = theme('links__menu_your_custom_menu_name', array('links' => $menu));
}